我回过头来,这次尝试使用CSS3过渡代替基于jQuery的过渡,使用Modernizr作为浏览器兼容性的备份。
我正在使用以下内容设置我的基类:
.box { transition: left 0.5s ease; }
.box-left { left: calc(left - 300px); }
.box-right { left: calc(left + 300px); }
在jQuery中,当点击“下一个”或“上一个”按钮时,我正在使用toggleClass。
您可以看到我正在尝试添加或减去当前的左值,但显然不会那样。
任何指针?我希望我对我的问题足够清楚。
谢谢!
编辑:
我给了calc()一个镜头,但我不知道会在操作员的左侧发生什么。
答案 0 :(得分:0)
我找到了解决方案。所以,和以前一样,我在CSS中定义过渡:
.box { transition: left 0.5s ease; left: 0px; }
但是,当需要动画时,我使用jQuery来更新带有计算左值的样式属性:
$('.box').css({'left':-(currentLeft) * multiplier});