質問
i次のスクリプトがあります
<script>
$(document).ready(function(){
$("div.mover").hover(function () {
$("div.hide1").fadeTo("slow", 0.33);
$("div.hide1").fadeTo("slow", 1);
},function(){
$("div.hide1").stop();
});
});
</script>
and html page is
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><div class="mover"><IMG SRC="images/buttons_full_01.png" ></div></td>
</tr>
<tr>
<td><div class="mover"><IMG SRC="images/buttons_full_02.png"></div></td>
</tr>
<tr>
<td><div class="mover"><IMG SRC="images/buttons_full_03.png"></div></td>
</tr>
</table>
私の機能は、ボタンの上でマウスの背景をフェードすることです
しかし、すべてのボタンの上にマウスを置いて、マウスがボタンを離れた後の問題 アニメーションは、すべてのトランザクションが完了するまで継続します。
私が欲しいのは:マウスが左に移動すると、ボタンのアニメーションが $(&quot; div.hide1&quot;)。fadeTo(&quot; slow&quot ;, 1); 停止
解決
マウスポインターが2番目(または3番目)の「ムーバー」上にドラッグされない限り、初期機能は正常に機能します。 div。その場合、次のようにいくつかのアニメーションがキューに入れられることがあります:
mover1.hover-over()
mover2.hover-over()
デフォルトでは、 stop
を呼び出すと、現在のアニメーションのみが終了します。2番目のムーバーのキューに入れられたアニメーションではなく、最初のムーバーで開始されたアニメーションです。
を呼び出したときにアニメーションキューをクリアすることにより、追加のアニメーションが実行されないようにすることができます。 stop
。オプションパラメータ clearQueue
を受け入れます。
$(document).ready(function(){
$("div.mover").hover(function () {
$("div.hide1").fadeTo("slow", 0.33).fadeTo("slow", 1);
}, function(){
// Added stop parameters and added an additional fadeTo,
// to make sure we get back to 100% opacity.
$("div.hide1").stop(true).fadeTo("slow", 1);
});
});
所属していません StackOverflow