我的html的正文部分是
<div class="scrollin" id="topscrollin" style="left:-300px;top:30px;"></div>
<div class="scrollin" id="bottomscrollin" style="right:-300px;top:120px;"></div>
css部分是
.scrollin{
background: #3300FF;
height:60px;
width:300px;
text-align: center;
color: #FFFFFF;
font-family: Segoe UI;
position: absolute;
z-index: 3;
}
脚本部分是
$(".scrollin").animate({scrollin:27},{
step:function(now){
$("#topscrollin").css('left',now+'%');
$("#bottomscrollin").css('right',now+'%');
}
})
当他们点击其他按钮时
$("#topscrollin").animate({right:-300},1000);
$("#bottomscrollin").animate({left:-300},1000);
第一个动画似乎有效。但第二个动画似乎不适用于topscrollin。当我搜索时,我发现它与初始设置左侧的位置有关。 我尝试使用该解决方案 http://jsfiddle.net/XqqtN/ 这是针对相反的情况。但它没有用。 `此外,如果将位置设置为左侧是问题,那么为什么第二种情况不会发生?
答案 0 :(得分:1)
如何改为左右?对100%? http://jsfiddle.net/PRLnm/
$("#topscrollin").animate({left:'100%'},1000);
$("#bottomscrollin").animate({right:'100%'},1000);