原生js返回顶部
let backToTop = function() {
let scrollToptimer = setInterval(function() {
let top = document.body.scrollTop || document.documentElement.scrollTop;
let speed = top / 4;
if (document.body.scrollTop !== 0) {
document.body.scrollTop -= speed;
} else {
document.documentElement.scrollTop -= speed;
}
if (top === 0) {
clearInterval(scrollToptimer);
}
}, 40);
};
原生js返回顶部的更多相关文章
- 原生js返回顶部(匀速、由快到慢)
在项目中我们经常有需求要求页面滚动到一定位置时出现返回顶部按钮,点击即返回顶部. 方法一: 锚点,这是最简单的.(a标签的href属性等于一直要到达位置元素的id值) 方法二: js直接给页面根节点设 ...
- 原生JS返回顶部,带返回效果
有些网站当滑到一定高度时右下角会有一个按钮,你只要一点就可以直接返回顶部了.那这个功能是怎么做到的呢.其实不算太难: 首先我们先在网页中创建一个按钮,上面写上返回顶部,把它的样式改成固定定位,之后想要 ...
- js返回顶部封装 简洁
js返回顶部封装 简洁: 加入html页面body最后面即可. <script> a(); function a() { $(function() { if ($(".j-to- ...
- 详解原生JS回到顶部
第一次知道可以用超链接(锚点)实现回到顶部的时候我是很震惊的,想着原来可以这么简单啊!但是作为一个正在学习JS的小白,不能就这么轻易止步,所以查资料自己整了一个JS返回顶部. HTML代码: ? 1 ...
- 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 返回顶部
<script> window.onload = function(){ var oTop = document.getElementById("to_top"); v ...
- 原生js回到顶部
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
随机推荐
- 【刷题】BZOJ 3033 太鼓达人
Description 七夕祭上,Vani牵着cl的手,在明亮的灯光和欢乐的气氛中愉快地穿行.这时,在前面忽然出现了一台太鼓达人机台,而在机台前坐着的是刚刚被精英队伍成员XLk.Poet_shy和ly ...
- Python OS模块中的fork方法实现多进程
import os '''使用OS模块中的fork方式实现多进程''' '''fork方法返回两次,分别在父进程和子进程中返回,子进程中永远返回0,父进程返回的是子进程的is''' if __name ...
- debian8.4 系统莫名没有声音
[http://www.linuxdiyf.com/viewarticle.php?id=437020 Debian8, 桌面环境是xfce4, 安装完成后发现前面板音频输出插孔正常,后面板的没声音. ...
- linux basic ------ shell
一般习惯把 shell 脚本语言和 shell 解释器统称为 shell,用 shell 脚本语言编写的程序简称脚本. shell 解释器 是用 c 语言写一个应用程序,它是用户使用 Unix / L ...
- NodeJS 笔记 URL模块
url模块 ,包含分析和解析 URL 的工具. var url = require('url'); url.parse(urlStr[, parseQueryString][, slashesDeno ...
- Django中Celery http请求异步处理(四)
Django中Celery http请求异步处理 本章延续celery之前的系列 1.settings配置 2.编写task jib_update_task任务为更新salt jid数据 3.url设 ...
- 使用Python的turtle(海龟)模块画图
第一步:让Python引入turtle模块,引入模块就是告诉Python你想要用它. import turtle 第二步:创建画布.调用turtle中的Pen函数 t = turtle.Pen() 第 ...
- ubuntu 发送邮件
1. 使用下面命令安装 sudo apt-get install heirloom-mailx 2. 编辑配置信息 vim /etc/nail.rc //此时如果打印没有权限则使用sudo命令,并且在 ...
- Spark记录-Scala模式匹配
Scala模式匹配 模式匹配是Scala函数值和闭包后第二大应用功能.Scala为模式匹配提供了极大的支持,处理消息. 模式匹配包括一系列备选项,每个替代项以关键字大小写为单位.每个替代方案包括一个模 ...
- js 语法高亮插件之 Prism.js
之前也介绍过几款语法高亮插件<为博客园选择一个小巧霸气的语法高亮插件>以及关于他们的综合性能<再议 语法高亮插件的选择>.今天在小影志博客看到<使用 Prism.js 实 ...