jquery - jQuery UI 滑出内容，新内容进入

Question

我正在努力实现这一目标：

http://i.imgur.com/fQM4ZR8.gif

使用jQuery UI | 滑动

遗憾的是，我没有要修复的代码，我正在寻找你能给我的如何实现这一目标的任何方向。它需要离开设定的距离，然后返回到它的初始起点并显示与他们单击的锚点相关的内容。很抱歉没有代码开始，我对 JavaScript 相当陌生。

非常感谢您提供的任何帮助或建议，

谢谢。

Answer 1

使用该.animate()函数更容易，因为它为动画提供了回调函数

$(function () {
    var wid = $('.content').width(); 
    $('.content').animate({"margin-right": "-" + wid + "px"}, 500, function ()   {

        $(this).text("new content");
        $('.content').animate({"margin-right": "0px"}, 500);
    });
});

工作示例：http: //jsfiddle.net/JMqpe/1/

此代码会将框一直向右移动（与宽度相同），更新内容，现在它已隐藏，然后返回其原始位置（假设它的 margin-right 开始时为 0）