jQuery 1.7 - 悬停不起作用

Question

我有一个代码，一个简单的悬停效果，在 jQuery 1.4 中运行良好，但在 jQuery 1.7 中无法运行

代码如下：

jQuery(document).ready(function() {
    /* When a thumbnail is hovered over do shine */
    $('.large_thumb').hover(function() {
        $(this).find(".large_thumb_shine").css("background-position", "-167px 0");
        $(this).find(".large_thumb_shine").stop().animate({
            backgroundPosition: '167px 0'
        }, 600);
    }, function() {
        $(this).find(".large_thumb_shine").stop().animate({
            backgroundPosition: '167px 0'
        }, 600);
    });
});​

应该怎么做：

在bg-position 上处理onmouseover 的内容上移动一个透明的类似闪亮的PNG。该效果不应在 onmouseout 上重复，因此是第二个函数。

由于某些原因，这个超级基本的代码在最新的 jQuery 1.7 中无法使用，但在 1.4 中仍然可以使用。

我已阅读文档并且似乎使用了正确的方法，悬停。我的代码中的问题似乎在哪里？

编辑：

jsfiddle

http://jsfiddle.net/3QRGD/

Answer 1

您可以尝试将 jQuery Animate step 函数与“无用”的 CSS 属性（即边框间距，您可能永远不会使用但不会影响布局的东西）一起使用：

演示：http://jsfiddle.net/SO_AMK/tTddS/

jQuery：

jQuery(document).ready(function() {

    /* When a thumbnail is hovered over do shine */
    $('.large_thumb').hover(function() {
        var shine = $(this).find(".large_thumb_shine");

        $(shine).css("background-position", "-167px 0");
        $(shine).stop().animate({
            "border-spacing": -167
        }, {
            step: function(now, fx) {
                $(shine).css("background-position", now + "px 0px");
            },
            duration: 600
        });



    }, function() {
        var shine = $(this).find(".large_thumb_shine");

        $(shine).stop().animate({
            "border-spacing": -167
        }, {
            step: function(now, fx) {
                $(shine).css("background-position", now + "px 0px");
            },
            duration: 600
        });
    });
});​