0

画像にカーソルを合わせると、画像の上に情報が表示される画像ホバーのコードがあります。コールバックでqueue:falseを使用することで、ユーザーがアニメーションに何度もカーソルを合わせたときにアニメーションが何度も起動するのを防ぎました。

私の問題は、mouseOverINGに少し夢中になった場合、ホバー状態のフェードイン/フェードアウトにより、ホバー画像が表示されなくなるまで情報の不透明度が低下することです。

$('.image').hover(function() {
    $('.linkWords', this).animate({
        opacity: "show"
    }, {
        queue: false
    });
}, function() {
    $('.linkWords', this).animate({
        opacity: "hide"
    }, {
        queue: false
    });
});

遊んでみたいと思ったら、これが私のjsfiddleです。

http://jsfiddle.net/bkbarton/qrprD/

ありがとう

4

2 に答える 2

0

.stop(true)次のアニメーションを開始する前に、要素を試してください。これにより、進行中の最終的に現在のアニメーションが停止します。

于 2011-09-08T17:28:15.563 に答える
0

「表示」ではなく、不透明度を1に送信します。「表示」では、現在の最大不透明度をフェードアウトする不透明度として使用できるため、フェードアウトしていて現在の不透明度が.5の場合、.5にフェードインして表示します。

$('.image').hover(function() {
    $('.linkWords', this).animate({
        opacity: 1
    }, {
        queue: false
    });
}, function() {
    $('.linkWords', this).animate({
        opacity: "hide"
    }, {
        queue: false
    });
});
于 2011-09-08T18:18:48.507 に答える