0

我的 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/ 。但它没有用。` 此外,如果将位置设置为左侧是问题,那么为什么第二种情况不会发生?

4

1 回答 1

1

换成左右 100% 怎​​么样? http://jsfiddle.net/PRLnm/

$("#topscrollin").animate({left:'100%'},1000);
$("#bottomscrollin").animate({right:'100%'},1000);
于 2013-08-02T23:43:54.557 回答