Question

我有一个可切换布局的网站。在默认值上，侧边栏（旁边）通常靠近内容float: right。当我单击切换时，侧边栏应该平滑地显示在浏览器窗口的右侧。我尝试了很多方法，但我无法使其完美运作。

以下是当前状态的小提琴：http://jsfiddle.net/kqzug20p/

如您所见，点击“Animate”按钮后，侧边栏首先向左移动，而不是向右移动。单击默认设置只会将侧边栏放回而不进行任何动画...

有任何想法，我做错了吗？

Answer 1

通常，问题是此元素没有初始的“right：”值。 jQuery的动画所做的是将现有（初始）值增加到目标值。

我已将right: 78px添加到“旁边”并删除了top:78px。此外，您可以为.css()方法

提供纯整数

CSS：

aside {
    float: right;
    right:78px;

JS：

$("aside").addClass("animate").animate({
        right: 0
    });

<强>已更新

这里是Back animation的更新：

<强> UPDATE2

以下是改进版本：JSFiddle

它具有更复杂的逻辑，可以用于不同的“主”尺寸。它可能不适合你100％，但给出了关于方向的想法