向下平滑滚动并隐藏滚动条答案

【问题标题】：Scroll smoothly down and hide scroll bars向下平滑滚动并隐藏滚动条
【发布时间】：2013-04-13 07:12:22
【问题描述】：

我有一个有 2 个 div 的页面（#page1 和 #page2 在彼此之上，这正是浏览器窗口的大小（由 jQuery 计算）。当我点击 id: name 的 div 时，我希望页面滚动顺利进入#page2。这一切正常。

但现在我想隐藏滚动条并阻止用户滚动。因此，用户可以进入该页面的唯一方法是单击#name div。但是当我尝试将正文设置为溢出时：隐藏页面将不再滚动到#page2。只有当我取出动画并且只使用scrollIntoView时。然后它跳转到#page2。这是我的代码：

$('#name').click(function() {
    //$('#page2')[0].scrollIntoView(true);
    $('#page2').scrollTo(500);
});


jQuery.fn.extend(
{
  scrollTo : function(speed, easing)
  {
    return this.each(function()
    {
      var targetOffset = $(this).offset().top;
      $('html,body').animate({scrollTop: targetOffset}, speed, easing);
    });
  }
});

如何结合动画和溢出：隐藏？

提前致谢！

【问题讨论】：

标签： jquery animation scroll jquery-animate scrollbar

【解决方案1】：

这将使您从顶部平滑滚动到 300PX：

   jQuery('html,body').stop().animate({  scrollTop:  300 }, 400, function () {});

以及禁用滚动条

$('body').css('overflow','hidden')

【讨论】：