js网页滚动条滚动事件实例分析
作者：yongtaiyu 发布时间：2024-04-28 09:38:19
标签：js,滚动条
本文实例讲述了js网页滚动条滚动事件用法。分享给大家供大家参考。具体分析如下：
在做js返回顶部的效果时，要监听网页滚动条滚动事件，这个事件就是：window.onscroll。当onscroll事件发生时，用js获得页面的scrollTop值，判断scrollTop为一个设定值时，显示“返回面部”
js网页滚动条滚动事件
<style type="text/css">
#top_div{
position:fixed;
bottom:80px;
right:0;
display:none;
}
</style>
<script type="text/javascript">
window.onscroll = function(){
var t = document.documentElement.scrollTop || document.body.scrollTop;
var top_div = document.getElementById( "top_div" );
if( t >= 300 ) {
top_div.style.display = "inline";
} else {
top_div.style.display = "none";
}
}
</script>
<a name="top">顶部<a>
<div id="top_div"><a href="#top">返回顶部</a></div>
<br />
<br />
<div>
这里尽量多些<br />以便页面出现滚动条，限于篇幅本文此处略去
</div>
例子语法解释
在 style 标签中首先定义 top_div css 属性：position:fixed;display:none; 是关键
javascript 语句中，t 得到滚动条向下滚动的位置，|| 是为了更好兼容性考虑
当滚动超过 300 （像素）时，将 top_div css display 属性设置为显示(inline)，反之则隐藏(none)
必须设定 DOCTYPE 类型，在 IE 中才能利用 document.documentElement 来取得窗口的宽度及高度
http://tools.jb51.net/table/javascript_event
希望本文所述对大家的javascript程序设计有所帮助。
0
投稿猜你喜欢
- 平时学生交上机作业的时候经常有人相互复制，直接改文件名了事，为了能够简单的检测这种作弊行为，想到了检测文件的MD5值，虽然对于抄袭来说作用不
- 原文件：7.8094,1.0804,5.7632,0.012269,0.008994,-0.003469,-0.79279,-0.06468
二进制日志的文件的作用 mysql二进制日志文件用来记录所有用户对数据库操作，即记录用户对数据库操作的- 本文实例讲述了python中pass语句用法。分享给大家供大家参考。具体分析如下：1、空语句 do nothing2、保证格式完整3、保证语
- 1、由于 Python 列表的切片会在内存中创建新对象，因此需要注意的另一个重要函数是itertools.islice。2、通常需要遍历切片
- 前一阵子经理问我能不能把用户最后一次登录我们的业务数据库的时间记录下来，因为之前有人修改过数据库sa用户的登录密码，所以我们要记录一下。 我
- MySQL的常见操作在这里先做一下总结，已经整合到代码里面，经过检验无误。/*创建一个数据库*/create database xuning
- 1. css背景图1.1 背景属性<!DOCTYPE html><html lang="en">
- 一般学习java和部署项目都是在本地部署，但是生产环境一般都是在linux环境下，部署和安装环境都是在控制台下进行操作的，没有windows
- 对于Python而言代码缩进是一种语法，Python没有像其他语言一样采用{}或者begin...end分隔代码块，而是采用代码缩进和冒号来
- matlab中的filter函数：y = filter(b,a,x)python实现matlab中的filter函数def filter_m
- poplib模块接收邮件python的poplib模块是用来从pop3收取邮件的，也可以说它是处理邮件的第一步。POP3协议并不复杂，它也是
- Celery是一个异步的任务队列(也叫做分布式任务队列),一个简单，灵活，可靠的分布式系统，用于处理大量消息，同时为操作提供维护此类系统所需
- 写在前面因为暂时还没有想好做什么具体的某个项目来提升对python的理解，所以就自己想着做一下小玩意来加强一下自己对一些库和方法的理解分析1
- 代码如下: '排序 Function Sort1(ary) Dim KeepChecking,I,FirstValue,Second
- 一. 访问WEB数据库的多种方案目前在WINDOWS环境下有多种访问WEB数据库的技术，主要有：1.公共网关接口CGI(Commo
- 大家好，今天就来说说requests的基础用法。1.准备工作首先呢，我们要确保我们已经之前安装requests库，如果没有安装，可以自行搜索
- 前言CAPTCHA全称Completely Automated Public Turing Test to Tell Computers a
- <％@ Language=VBScript ％><％Option Explicit ％><％Dim strUR
- 如下所示：#!/usr/bin/env python#-*- coding: utf-8 -*-"""[0,
