0

数日前に jQuery/javascript の学習を始めたばかりで、実際にやって学ぶのが好きで、ナビゲーション用にスライドするこれらの div を作成しました。最初は見栄えがしますが、ナビゲートし続けると、数回クリックした後にバグが発生します。

var home=$(".navHome");
home.mouseover(function(){
  home.animate({
   left:'30px',
   top:'25px',
   opacity:'0.75',
   });
  });
home.mouseout(function(){
 home.animate({
  left:'25px',
  top:'25px',
  opacity:'1',
 });
});
home.mouseover(function(){
  home.addClass("orangeText");
});
home.mouseout(function(){
  home.removeClass("orangeText");
});

これを合理化してよりうまく機能させる方法はありますか？また、マウスがdivを数回すばやく前後に移動すると、divが前後に痙攣し始めるようです。そのようなことが起こらないように何かを入れる方法はありますか？ありがとう！

4

3 に答える 3

1

Instead of home.animate() use home.stop().animate().

Using stop() prevents the animations from queuing one after the other.

于 2012-11-21T23:57:22.330 に答える
0

マウスを前後に動かすと、追加のアニメーションが待ち行列に入れられます。この使用stop()方法を防ぐには

home.mouseover(function(){
  home.stop(true,true)animate({/* settings*/})
})

API リファレンス: http://api.jquery.com/stop/

于 2012-11-22T00:00:22.100 に答える
0

$.animate().stop() がまだアニメーション キューを積み上げている場合は、$.css() を使用します。これは、レンダリングが約 10 倍高速であるためです。

于 2012-11-22T00:02:15.047 に答える