所有编辑的编辑：经过几个月的处理,问题似乎是当前元素中的一些/所有元素浮动/绝对定位.这似乎干扰了滑动.
如果您遇到同样的问题,我希望您有幸解决您的问题.
原帖：
真的很简单.我有几个带有几个元素的div,并且一次只显示其中一个div(其余的都是隐藏的).
当用户单击“下一步”时,当前div应该通过向左滑动隐藏,下一个div应该通过从右侧滑入来显示(实际逻辑不是问题).
当我尝试使用.slideUp()和.slideDown()时,它工作得很漂亮.但是,在尝试时：
$(oldBox).hide("slide",{ direction: "right" },1000);
它不起作用.我已经将JQuery UI链接到了,所以这不是问题.
任何帮助将非常感激.
编辑：链接到JSFiddle：http://jsfiddle.net/NFyRW/
EDIT2：JSFiddle中的单词;但是,我一直无法让它在我的实际网站上工作. JS位于一个单独的文件中,并加载到每个页面的标题中(每个页面都有相同的标题).
解决方法
如果您的幻灯片绝对定位,请使用left属性为它们设置动画.如果它们是相对的,那么将左侧切换为margin-left.
考虑到您的HTML看起来类似于：
<div id="mainContainer">
<div class="slide"></div>
<div class="slide"></div>
</div>
#mainContainer {}
.slide {position:absolute;top:0;left:0;}
这样的事应该
>淡出当前的幻灯片
>将当前幻灯片向左推出
>淡入新幻灯片
>从右侧拉入新幻灯片
.
var $oldBox=$('#oldBox'); $oldBox.animate({ 'left':-$oldBox.outerWidth(true),'opacity':0 },{duration:500,queue:false,specialEasing:{'left':'linear','opacity':'linear'}}); $newBox.animate({ 'left':0,'opacity':1 },'opacity':'linear'}});
