我的网站上有一个标记排列如下：
<body>
<div id="wrapper">
<div id="middle">
<div class="red-container">
<div class="row">
Middle. Row 1.
</div>
</div>
</div>
<div id="right">
<div class="green-container">
<div class="row">
Right. Row 1.
</div>
</div>
</div>
</div>
</body>
显而易见，rightdiv必须位于middlediv的右侧。这是小提琴（在我的小提琴里，rightdiv实际上不在middlediv的右边）：http://jsfiddle.net/NNMYS/
我正在尝试在此处实现滑动效果：middlediv中的所有内容都应该向左滑动，并在动画之后删除。另一方面，同时，来自rightdiv的内容（在我的情况下，它将通过ajax添加到rightdiv）应该从右侧的div滑动到middlediv（并从rightdiv中删除）。如何做到这一点？
我本可以直接制作一个内容滑块，将所有内容直接放置，并按位置分隔，然后滑动到单击的项目。但在这里，由于我将通过ajax添加内容，并且还有一些响应式实现，在我的情况下，这似乎是不可能的。
看看这个。我认为这可能有助于
http://tympanus.net/codrops/2012/04/09/direction-aware-hover-effect-with-css3-and-jquery/