JQuery将后续元素与当前元素一起滑动

Question

如何使用JQuery实现以下向左滑动效果？

1. 我有几个div元素互相浮动。
2. 我想在第一个元素（最左边的元素）上应用向左滑动动作。
3. 动画完成后，其余元素应滑动，而不是JUMP。 （跳是我的问题）

我可以使用toggle并向上滑动，但我需要向左滑动而不是向上/向下滑动。

这是 jsFiddle 。




JavaScript的：

$('button').click(function() {
    $('#page1').hide('slide', {direction: 'left'}, 1000);
});

HTML

<button>Slide left</button>

<div class='container'>
    <div id='page1'>
        Content 123
    </div>

    <div id='page2'>
        Content 456
    </div>    
</div>

CSS

.container div { float:left; }

Answer 1

$('#page1').animate({'margin-left': '-100px'}, 1000, 
    function() {$(this).hide();}
);

原则上，使用动画。