Jquery鼠标悬停不适用于精灵动画

时间:2012-11-10 11:54:49

标签: javascript jquery animation mouseover

我无法将鼠标移交给工作。

我想在某个位置移动div并使用鼠标悬停,鼠标点击和拖放进行一些div交互。但是,我阻止了,因为,第一步,鼠标悬停,不喜欢工作。 这就是代码:

    (function($) {
        $(document).ready(function() {

        $("#dxani").mouseover(function() { $("#dxani").css("background-image", "url(img/sprite/fr1.png)") });
        $('#dxani').sprite({fps: 3, no_of_frames: 4})
        $("#dxani").animate({marginLeft: "+=200px", }, 20000 );
        setTimeout(function() {$("#dxani").css("background-image", "url(img/sprite/sprite1sx.png)")} , 20000 );
        $("#dxani").animate({marginLeft: "-=200px", }, 20000 );
        setTimeout(function() {$("#dxani").css("background-image", "url(img/sprite/sprite1dx.png)")} , 40000 );
        $("#dxani").animate({marginLeft: "+=400px", }, 40000 );
        setTimeout(function() {$("#dxani").css("background-image", "url(img/sprite/sprite1sx.png)")} , 80000 );
        $("#dxani").animate({marginLeft: "-=400px", }, 40000 );
        setTimeout(function() {$("#dxani").css("background-image", "url(img/sprite/sprite1dx.png)")} , 120000 );
        $("#dxani").animate({marginLeft: "+=800px", }, 80000 ); 
        setTimeout(function() {$("#dxani").css("background-image", "url(img/sprite/sprite1dx.png)")} , 200000 );
        $("#dxani").animate({marginLeft: "-=800px", }, 200000 );    



        });
    })(jQuery);

1 个答案:

答案 0 :(得分:0)

如果精灵要显示不同的区域,则需要更新background-position