在默认情况下,页面加载完后默认滚动在最顶端,有些时候我们需要在页面打开后,定位滚动条的位置,比如,横向和纵向滚动条居中,实现页面滚动的方法有三种:scroll、scrollBy和 scrollTo,三个方法都带两个参数:x(X轴上的偏移量)和y(Y轴上的偏移量)。因此我们只需修改x,y的偏移量来设置滚动条的位置。另外,页面的滚动高度必须在网页加载完成后才能获取到,所以触发事件用onload。

方法一:用scroll方法实现滚动条位于最底端。

<body onload="scroll(0,document.body.scrollHeight) "> 

方法二:用scrollBy方法实现滚动条位于最右端。

<body onload="scrollBy(document.body.scrollWidth,0) ">

方法三:用scrollTo方法实现水平滚动条和纵向滚动条均居中。

<body onload="scrollTo(document.body.scrollWidth/2,document.body.scrollHeight/2)">

虽然使用scroll、scrollBy和scrollTo方法的效果一样,但是彼此之间还是有一些区别的。 经测试如果使用某一确定的位置参数时,不需要带单位,例据顶端300像素:

<body onload="scroll(0,300) "> 

scroll、scrollBy和 scrollTo三种方法定位滚动条位置的更多相关文章

  1. App元素定位三种方法

    来自博客: http://testingpai.com/article/1595507262082 以下方法操作前必须确保有手机设备连入电脑,检测是否有手机连入命令 adb devices 第一种:A ...

  2. 纯Css绘制三角形箭头三种方法

    在制作网页的过程中少不了绘制类似图片的三角形箭头效果,虽然工程量不大,但是确实麻烦.在学习的过程中,总结了以下三种方法,以及相关的例子. 一.三种绘制三角形箭头方法 1.方法一:利用overflow: ...

  3. javascript实现图片延迟加载方法汇总(三种方法)

    看到一些大型网站,页面如果有很多图片的时候,当你滚动到相应的行时,当前行的图片才即时加载的,这样子的话页面在打开只加可视区域的图片,而其它隐藏的图片则不加载,一定程序上加快了页面加载的速度,跟着小编一 ...

  4. python3 打开页面后多窗口处理三种方法

    多窗口处理三种方法 导包,实例化浏览器from selenium import webdriver fx=webdriver.Firefox()方法一fx.switch_to.window(fx.wi ...

  5. Tomcat项目部署的三种方法

    第一种方法如下:直接把我们的项目文件夹放到tomcat里面,在这里我自己做的是一个测试项目oa,如图 启动tomcat,打开浏览器,输入localhost/oa  即可打开你的文件,注意 :访问的时候 ...

  6. java 分次读取大文件的三种方法

    1. java 读取大文件的困难 java 读取文件的一般操作是将文件数据全部读取到内存中,然后再对数据进行操作.例如 Path path = Paths.get("file path&qu ...

  7. 应对加密js的三种方法

    经常遇到网页在登录后会对用户输入的帐号和密码通过js进行加密,导致模拟登录这类网站时受到阻碍 这里小记一下当前解决该问题的三种方法 1.利用python实现js同等加密. 2.利用selenium模拟 ...

  8. C# | VS2019连接MySQL的三种方法以及使用MySQL数据库教程

    本文将介绍3种添加MySQL引用的方法,以及连接MySQL和使用MySQL的教程 前篇:Visual Studio 2019连接MySQL数据库详细教程 \[QAQ \] 第一种方法 下载 Mysql ...

  9. 像画笔一样慢慢画出Path的三种方法(补充第四种)

    今天大家在群里大家非常热闹的讨论像画笔一样慢慢画出Path的这种效果该如何实现. 北京-LGL 博客号@ligl007发起了这个话题.然后各路高手踊跃发表意见.最后雷叔 上海-雷蒙 博客号@雷蒙之星 ...

随机推荐

  1. Git Bash 简单操作

    在Windows下使用Git Bash,用的是Linux命令,常用几个文件操作命令如下: Windows命令 Linux命令 意义 cd e:\xxx cd /e/xxx 切换到xxx目录 cd pw ...

  2. JavaScript(3)—— 正则表达式

    ---恢复内容开始--- 正则表达式 这是写的正则表达式,正则表达式的点比较多,也比较细.所以有些地方我们得注意的比较多.正则表达式在JS中是很重要的一个部分,其中他的语法都得牢记.不过最好还是理解性 ...

  3. Python Tools

    [TOC] Python virtualenv.fabric 和 pip 是 pythoneer 的三大神器 pip pip pip是一个安装和管理Python包的工具,是easy_install的一 ...

  4. jQuery中的方法

    jQuery中的方法来操作HTML标签中的属性 attr(name)    获取当前对象的指定的属性的值 attr(key,value)  给当前对象设置属性值 attr(properties)  一 ...

  5. 用js动态的改变img标签里面的src属性实现图片的循环切换

    JS:根据循环切换的条件可以用 document.getElementById('').src=''设置, 或者jquery方法: $('#id').attr('src','图片名称’): 具体: i ...

  6. 使用OpenCV查找二值图中最大连通区域

    http://blog.csdn.net/shaoxiaohu1/article/details/40272875 使用OpenCV查找二值图中最大连通区域 标签: OpenCVfindCoutour ...

  7. hdu_1254_推箱子(双BFS)

    题目连接:http://acm.hdu.edu.cn/showproblem.php?pid=1254 题解:以箱子为主体,第一层BFS,然后用第二层BFS来判断人是否可以到达,这里细节比较多,要注意 ...

  8. php:二进制处理

    直接上代码 <?php #字符串 #php中字符串就是二进制,不用特别转化 #方法1:直接把字符串当成二进制 $c = "ccc"; var_dump($c, bin2hex ...

  9. Golang:测试map是否存在

    请看这个url:http://www.du52.com/text.php?id=561 if v, ok := m1["a"]; ok { fmt.Println(v) } els ...

  10. 利用proxychains在终端使用socks5代理

    最近用各种脚本下载东西的时候发现有的站点需要当地IP才能下,比如.....nico, youtube等: 所以就找了下能在终端用socks5代理的工具,最后找到了proxychains,从此再无压力= ...