小编Gen*_*ham的帖子

试着最终把这个孩子放到床上......(见这里和这里的背景/以前的尝试和讨论)

我试图通过向左/向右滑动来隐藏元素,并通过向左或向右滑动来显示元素:

$(oldBox).hide('slide',{direction:'right'},500);
$(newBox).show('slide',{direction:'right'},500);

实际发生的是旧元素隐藏而不滑动,新元素显示没有滑动.

HTML的相关部分(相同的代码重复几次,只是对id和名称进行了更改):

<div class="x" id="waistBox">
    <div class="measureCol measureColLeft">
        <span class="measureHeader">Waist</span>
        <div class="measureDescription">
            Surround your waist with the tape measure at the height
            you are most comfortable wearing your pants. Adjust the
            tape measure to your desired snugness, as your purchase
            waist will match this measurement exactly (e.g. 34.75
            inches).
        </div>
        <div class="measureValue">
            <input type="text" name="waist" value = "1" id="waistInput" class="editMeasureInfo"/>
            <i>inches</i>
        </div>
    </div>
    <div class="measureCol measureColRight">
        <div class="measureVideoContainer">
            <img src="../../images/Measure_Video.PNG" class="measureVideo" /> …

所有编辑的编辑：经过几个月的努力，问题似乎是当当前元素内的部分/所有元素浮动/绝对定位时。这似乎会干扰滑动。

如果您遇到同样的问题，祝您好运，解决您的问题。

原帖：

真的很简单。我有几个带有多个元素的 div，并且一次仅显示其中一个 div（其余的都隐藏）。

当用户点击“Next”时，当前div应该向左滑动隐藏，下一个div应该从右侧滑入显示（实际逻辑不是问题）。

当我尝试使用 .slideUp() 和 .slideDown() 执行此操作时，效果非常好。然而，当尝试时：

$(oldBox).hide("slide", { direction: "right" }, 1000);

它不起作用。我已经链接了 JQuery UI，所以这不是问题。

任何帮助将非常感激。

编辑：链接到 JSFiddle：http://jsfiddle.net/NFyRW/

EDIT2：它用 JSFiddle 表示；但是，我无法让它在我的实际网站上运行。JS 位于单独的文件中，并加载到每个页面的页眉中（每个页面的页眉相同）。