如何在jquery中使用滑动div

Question

我有两个div，它们都是屏幕的高度，顶部div称为button并且有一个按钮，底部div称为content有一些数据。

我想在jquery中隐藏底部屏幕，当我点击顶部div上的按钮时，我想滑动底部div，以便它有点滑入屏幕。

我不想要任何滚动条。任何人都知道实现这一目标的最佳方法是什么？ ty提前。

这是代码：

<div class="button>...</div>
<div class="content">...</div>

Answer 1

如果你能够包含JQuery UI，你可以使用这样的幻灯片效果......

$(
  $(".button").hide("slide", { direction: "up" }, 1000);
  $(".content").show("slide", { direction: "up" }, 1000);
);

如果你正在使用某种点击事件......

$(
  $(somethingYouWillClick).click(function(){
    $(".button").hide("slide", { direction: "up" }, 1000);
    $(".content").show("slide", { direction: "up" }, 1000);
  });
);

slide effect documentation

我相信防止滚动条会成为一个CSS问题。