window.scrollTo和window.scrollBy

scrollTo-- 在窗体中如果有滚动条,将横向滚动条移动到相对于窗体宽度为x个像素的位置,将纵向滚动条移动到相对于窗体高度为y个像素的位置(如果没有滚动条,页面不会发生任何变化)

  • scrollTo,中文"滚动到"
  • 引用网址:http://www.dreamdu.com/javascript/window.scrollTo/
  • to是绝对的意思(从整体而言),by是相对的意思(从原先的位置而言)
scrollTo(x,y);(如果只有纵向滚动条,x y的值都不为零,则只有纵向滚动条滚动,反之依然,scrollBy 一样)

scrollTo函数参数说明

  • x -- 滚动条移动的水平像素
  • y -- 滚动条移动的垂直像素
scrollBy-- 如果有滚动条,将横向滚动条移动到相对于当前横向滚动条的x个像素的位置(就是向左移动x像素),将纵向滚动条移动到相对于当前纵向滚动条高度为y个像素的位置(就是向下移动y像素)
  • scrollBy,中文"滚动到"
  • 引用网址:http://www.dreamdu.com/javascript/window.scrollBy/
  • to是绝对的意思(从整体而言),by是相对的意思(从原先的位置而言)

scrollBy函数语法

scrollBy(x,y);

scrollBy函数参数说明

  • x -- 滚动条移动的水平像素
  • y -- 滚动条移动的垂直像素

使用DEMO:

页面中的回到顶部效果:

$(window).scrollTo(0,0);

回到页面的底部的效果:

$(window).scrollTo(0,$(document).height());

原文地址:https://www.cnblogs.com/xiaofenguo/p/6076787.html