2

ホバーしたときにdivがあり、2番目の画像が上にスライドし、マウスが離れると、アニメーションはまさに私が望むようになりますが、アニメーションを終了させずにマウスの出し入れが速すぎると、バグが発生します。アニメーションを残した高さに移動します。何日もさまざまなブログを見ていて、修正が見つからないようです。プロトタイプを使用していて、ここに私のコードがあります。

$('mid_about_us').observe('mouseenter',function() {
$('about_us_mo').slideDown({duration: 0.5});
}); 
$('mid_about_us').observe('mouseleave',function() {
$('about_us_mo').slideUp({duration: 0.5});
}); 

#about_us_mo{
position: absolute;
float: left;
bottom: 452px;
left: 4px;
z-index:99999;
overflow: hidden;

}

4

1 に答える 1

1

ScriptaculousEffectsQueueを使用する必要があります。

ハンドラーは、イベントが発生するとすぐに非同期で起動するため、イベントが非常に迅速に発生すると、ハンドラーは重複して互いに競合します。あなたが本当に望んでいるのは、それらがキューに並んで、それらの前のものが終了するとすぐに順番に実行することです。

これはそれについての本当に良い記事です：
http ：//script.aculo.us/docs/EffectQueues.html

コードは次のようになります。 

$('about_us_mo').slideDown({duration: 0.5, queue: 'end'});

また、相互に干渉する場合は、複数のエフェクトキューを作成するなどの操作を行うこともできます。この記事はそのすべてをうまく説明しています。

HTH-ケン

于 2011-08-10T16:14:09.867 に答える