js 返回顶部
<script>
window.onload = function(){
var oTop = document.getElementById("to_top");
var screenw = document.documentElement.clientWidth || document.body.clientWidth;
var screenh = document.documentElement.clientHeight || document.body.clientHeight;
oTop.style.left = screenw - oTop.offsetWidth +"px";
oTop.style.top = screenh - oTop.offsetHeight + "px";
window.onscroll = function(){
var scrolltop = document.documentElement.scrollTop || document.body.scrollTop;
oTop.style.top = screenh - oTop.offsetHeight + scrolltop +"px";
}
oTop.onclick = function(){
document.documentElement.scrollTop = document.body.scrollTop =0;
}
} </script>
<div id="to_top">返回顶部</div>
js 返回顶部的更多相关文章
- js返回顶部封装 简洁
js返回顶部封装 简洁: 加入html页面body最后面即可. <script> a(); function a() { $(function() { if ($(".j-to- ...
- js返回顶部效果
当用户浏览的网页过于长的时候,用户在浏览到网页底部想要在返回顶部需要滚动好几次滚轮才能返回顶部,不仅麻烦,而且用户体验也会很差.现在的大多是页面都会在页面顶部或者是页面的可见区域的某一位置固定一个按钮 ...
- 原生js返回顶部(匀速、由快到慢)
在项目中我们经常有需求要求页面滚动到一定位置时出现返回顶部按钮,点击即返回顶部. 方法一: 锚点,这是最简单的.(a标签的href属性等于一直要到达位置元素的id值) 方法二: js直接给页面根节点设 ...
- 原生JS返回顶部,带返回效果
有些网站当滑到一定高度时右下角会有一个按钮,你只要一点就可以直接返回顶部了.那这个功能是怎么做到的呢.其实不算太难: 首先我们先在网页中创建一个按钮,上面写上返回顶部,把它的样式改成固定定位,之后想要 ...
- js返回顶部小Demo
<style> .divH { height: 1800px; } .divT { width: 50px; height: 50px; font-size: 18px; backgrou ...
- js返回顶部
1. function scrollTop(){ $(},); } 2. $("#side-bar .gotop").click(function(){ $(},); //返回顶部 ...
- 原生js返回顶部
let backToTop = function() { let scrollToptimer = setInterval(function() { let top = document.body.s ...
- 详解原生JS回到顶部
第一次知道可以用超链接(锚点)实现回到顶部的时候我是很震惊的,想着原来可以这么简单啊!但是作为一个正在学习JS的小白,不能就这么轻易止步,所以查资料自己整了一个JS返回顶部. HTML代码: ? 1 ...
- js实现返回顶部功能的解决方案
很多网站上都有返回顶部的效果,主要有如下几种解决方案. 1.纯js,无动画版本 window.scrollTo(x-coord, y-coord); window.scrollTo(0,0); 2.纯 ...
随机推荐
- make、makefile
http://blog.csdn.net/wed110/article/details/34853475 什么是makefile?或许很多Winodws的程序员都不知道这个东西,因为那些Windows ...
- 【传智播客】Libevent学习笔记(一):简介和安装
目录 00. 目录 01. libevent简介 02. Libevent的好处 03. Libevent的安装和测试 04. Libevent成功案例 00. 目录 @ 01. libevent简介 ...
- Myeclipse快速排版的快捷键
Myeclipse快速排版的快捷键 1.全选 ctrl+a 2.排版 ctrl+i
- android-async-http框架库使用基础
开源项目链接 android-async-http仓库:git clone https://github.com/loopj/android-async-http android-async-http ...
- 一次URL请求过程--tomcat
一:请求的过程 1.DNS域名解析 2.建立TCP连接(三次握手) 3.发送请求--tomcat进行处理 4.四次挥手关闭连接 二:详解1---DNS域名解析 1.浏览器会检查缓存中有没有这个域名对应 ...
- HTML 之 DOM文件对象模型
文件对象模型 (DOM: Document Object Model) DOM 是 W3C定义的一种访问文档的标准. "The W3C Document Object Model (DOM) ...
- 页面jsp向后端发送:HTTP 400错误 - 请求无效(Bad request)
HTTP 400错误 - 请求无效(Bad request) jsp页面有误 在ajax请求后台数据时有时会报 HTTP 400 错误 - 请求无效 (Bad request);出现这个请求无效报错说 ...
- linux下nginx、php和mysql安装配置
一.安装nginx 安装nginx yum install -y epel-release yum install nginx -y 查看nginx软件包包括了哪些文件 rpm -ql nginx 启 ...
- buf.keys()
buf.keys() 返回:{Iterator} 创建并返回一个包含 Buffer 键名(索引)的迭代器. const buf = Buffer.from('buffer'); for (var ke ...
- 怎样提高ES集群的稳定性?
别挂master节点. 稳定性:独立的master节点, 独立的协调节点 > master兼职协调节点 > master兼职数据节点 > master 兼职协调 + 数据节点. cl ...