Question

IE中的动画问题我试图连续，平稳地左右移动背景。代码适用于除IE以外的所有浏览器。
问题：从左向右移动显示问题。
请找到我添加的fiddle 。

＆＃13;

function call1(){
	$('.container').animate({ 'background-position-x': '100%' }, 2000);
}

function animateBg(){
    call1();
    setTimeout(function(){
    	$('.container').animate({ 'background-position-x': '0%' }, 2000,function(){
			animateBg();
        });
        console.log("hii");
    });
}

animateBg();

＆＃13;

.main{height:100%;}
.container{
    background:url('http://www.smartbygep.com/sites/default/files/SBG-home-page-banner.jpg')no-repeat top center;
    background-position-x:0%;   
    color:#333; /*-moz-transition: all .5s;
     -webkit-transition: all .5s;
    transition: all .5s;
    -moz-transform: scale(1,1);
    -webkit-transform: scale(1,1);
    transform: scale(1,1);*/
    background-size:120% 100%;             
    background-color:#ccc;
    height:300px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="main">
    <div class="container">
        Sample text
    </div>
</div>

＆＃13;

Answer 1

你必须使用

animate({ backgroundPosition: '0%' }

JSFiddle

background-position-x + animate从右到左+ IE

1 个答案: