jQuery动画背景位置，不工作在ie [英] jQuery animate background-position, not working in ie

问题描述

我有一个小的jQuery animate函数，它在除IE之外的所有浏览器中工作。这里我的代码：
HTML：

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

CSS：

 code> .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 $ b $ e.find（。bgHover）。stop（）。animate（{backgroundPosition：0}，500，function（）{
 $ e.find（。bgHover）。css -position， -  99px 0）; 
 $ e.find（。bgHover）。animate（{backgroundPosition：'99px 0'}）; 
} ，2500）; 
}）; 
  

请在上述代码中找到除IE以外的所有浏览器。

解决方案

您需要使用

  css b $ bbackground-position-x：-99px，
background-position-y：0
 
）; 
  

但是在IE8中的rmbr和之前，你需要使用一些其他脚本，

我相信这将帮助你 https://github.com/kbwood/backgroundpos

I am having a small jQuery animate function, which is working in all browsers except IE. Here my code: 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);
        });

Please find the above code which is working in all Browsers except IE.

解决方案

You need to use

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

    ); 

But rmbr in IE8 and before that, you need to use some other scripts, I'm looking for it

EDIT:

I belive that will help you https://github.com/kbwood/backgroundpos

这篇关于jQuery动画背景位置，不工作在ie的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！