在默认情况下,页面加载完后默认滚动在最顶端,有些时候我们需要在页面打开后,定位滚动条的位置,比如,横向和纵向滚动条居中,实现页面滚动的方法有三种: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. tomcat session失效时间

    conf\web.xml <session-config> <session-timeout>600</session-timeout> </session- ...

  2. 浅析js模板引擎

    js模板引擎越来越多的得到应用,如今已经出现了几十种js模板引擎,国内各大互联网公司也都开发了自己的js模板引擎(淘宝的kissy template,腾讯的artTemplate,百度的baiduTe ...

  3. 在CentOS linux上通过yum安装JDK<转>

    卸载centos自带的jdk 1.查看当前的jdk版本,并卸载 [root@localhost opt]#  rpm -qa|grep java  java-1.6.0-openjdk-1.6.0.3 ...

  4. k个区间相交的段落数 Educational Codeforces Round 4 D

    http://codeforces.com/contest/612/problem/D 题目大意:给你n个区间,这n个区间会有相交的部分,如果一个区间相交的部分>=k,那么就把这个区间记录下来. ...

  5. POJ 2418 Hardwood Species (哈希,%f 和 %lf)

    我的错因: 本来改用%f输出,我用了%lf,结果编译器直接判定为错误(一部分编译器认为lf是没有错的).当时我还以为是hash出错了.. 方法不止一种: 方法 时间   空间 Hash 891ms 5 ...

  6. Java静态语句块、语句块、构造方法执行顺序

    package com.imooc.practice; class Parent{ public Parent(){ System.out.println("Parent构造方法执行!&qu ...

  7. hdu_3182_Hamburger Magi(状压DP)

    题目连接:http://acm.hdu.edu.cn/showproblem.php?pid=3182 题意:有n个汉堡,做每个汉堡需要消耗一定的能量,每个汉堡对应一定的价值,且只能做一次,并且做当前 ...

  8. UIImageView的UserInteractionEnabled什么时候为no

    UIImageView作为背景,但直接把按钮或者UITextField放在上面无法相应事件 特殊子类的覆盖 userInteractionEnabled属性默认值为YES,但UIView的一些子类中对 ...

  9. Ansible10:Playbook的角色与包含【转】

    当单个playbook文件越来越大的时候,我们就需要重新来组织Playbooks了.我们可以将一个大的playbook拆成若干个小的playbook文件,然后通过include的方式,在主配置文件中将 ...

  10. Linux 任务控制(bg job fg nohup &)

    一. 简介     Linux/Unix 区别于微软平台最大的优点就是真正的多用户,多任务.因此在任务管理上也有别具特色的管理思想.我们知道,在 Windows 上面,我们要么让一个程序作为服务在后台 ...