1

このコードに奇妙な問題があります

    $('img').hover(function(){
        var $cap = $(this).parent().find('.cap');
        window.setTimeout(function(){$cap.stop(true,false).animate({bottom:164},500)},500);
    },function(){
        var $cap = $(this).parent().find('.cap');
        window.setTimeout(function(){$cap.stop(true,false).animate({bottom:0},500)},500);
    })

効果が上下し続けて止まらない理由がわかりません。stop()いろいろなパラメータで試してみました。そしてclearQueue()。しかし、何も役に立たないようです。

基本的な考え方は、マウスをホバーすると画像がキャプションを上にスライドすることです。そして、マウスが完全に画像から外れるまで留まり、その後下にスライドします。

私が間違っていることについて何か考えはありますか？

実例http://jsfiddle.net/zSAYZ/

最新のChromeonMacキャプションが付いたPSは、マウスが静止している場合は下にスライドしません。最新のFirefoxのキャプションは、マウスが画像にカーソルを合わせるまで上下に移動します。

4

1 に答える 1

1

これは、キャプションが表示されているときに、画像ではなくキャプションの上にカーソルを置いているために発生すると思います。キャプションが下がると、画像にカーソルを合わせるとキャプションが上がり、(画像ではなく) キャプションにカーソルを合わせるとキャプションが下がります。

これはうまく機能します (キャプションがマウスに合うと一時停止しますが、それ以外の場合は機能します)。改善できる場合があります。

http://jsfiddle.net/x5UAH/4/

$(document).ready(function () {
    $('.contain').hover(
        function(){
            $(this).find('.cap').stop(true,false).animate({bottom:164},500);
        },
        function(){
             $(this).find('.cap').stop(true,false).animate({bottom:0},500);
        }
    );
});
于 2011-12-03T22:27:22.133 に答える