jQuery Slide to left right on a spitted Page

Question

我想将 HTML 页面拆分 50%。如果单击左侧，则它应该滑动到 90%。右侧也是如此。

我查看了一些站点，但不知何故无法理解如何去做 http://www.learningjquery.com/2009/02/slide-elements-in-different-directions/

Answer 1

html

<div class="main">
  <div class="left pane">
  </div>
  <div class="right pane">
  </div>
</div>

CSS

.main 
{
  width : 960px;
}

.pane
{
  width : 50%;
  height : 500px;
  float:left;
}

.pane.right
{
  float : right;
}

js

$(".pane").click(function()
{
  var ele = $(this);

  $(".pane").animate({
    width : 50%
  },
  3000,
  function()
  {
      ele.animate({
        width : 90%
     })    
  });
});

这只是一个让你入门的例子

如果右 Pane 超出屏幕，那么您可以为 margin-left css 属性设置动画