jQuery的动画背景位置,即不工作(jQuery animate background-posit

2019-10-19 00:22发布

我有一个小的jQuery动画功能,它除了IE浏览器的所有工作。 在这里我的代码:HTML:

<div class="container">
  <div class="bg"></div>
  <div class="bgHover"></div>
</div>

CSS:

.container{width:54px; height:54px;}
.bgHover{background: url("../images/shine.png") no-repeat scroll -150px 0 rgba(0, 0, 0, 0); width:54px; height:54px; position: absolute; top: 8px; left: 8px;}
.bg{background-color:black; width:54px; height:54px;}

jQuery的:

$(document).ready(function(){
            var $e = $(".container")
            timer = setInterval(function(){
                $e.find(".bgHover").stop().animate({backgroundPosition: 0},500,function(){
                    $e.find(".bgHover").css("background-position","-99px 0"); 
                    $e.find(".bgHover").animate({backgroundPosition: '99px 0'});
                });
            },2500);
        });

请发现这是工作在所有浏览器IE除了上面的代码。

Answer 1:

您需要使用

    css({
        "background-position-x" : "-99px",
        "background-position-y" : "0"

    ); 

但在IE8和之前rmbr,你需要使用一些其他的脚本,我在寻找它

编辑:

我相信,这将有助于你https://github.com/kbwood/backgroundpos



文章来源: jQuery animate background-position, not working in ie