原生js-返回顶部
html部分:
<body style="height:2000px">
<div id="div1">
返回顶部
</div>
</body>
css部分:
#div1{
position:fixed;
_position:absolute;
right:0;
bottom:0;
width:200px;
height:200px;
background:#f00;
display:none;
}
js部分:
window.onscroll=function(){
if(-[1,]){
var y=window.pageYOffset;
}else{
var y=document.documentElement.scrollTop;
}
var div1=document.getElementById("div1");
if(y>=150){
div1.style.display="block";
}else{
div1.style.display="none";
}
div1.onclick=function(){
window.scrollTo(0,0);
}
}
原生js-返回顶部的更多相关文章
- 原生js返回顶部(匀速、由快到慢)
在项目中我们经常有需求要求页面滚动到一定位置时出现返回顶部按钮,点击即返回顶部. 方法一: 锚点,这是最简单的.(a标签的href属性等于一直要到达位置元素的id值) 方法二: js直接给页面根节点设 ...
- 原生JS返回顶部,带返回效果
有些网站当滑到一定高度时右下角会有一个按钮,你只要一点就可以直接返回顶部了.那这个功能是怎么做到的呢.其实不算太难: 首先我们先在网页中创建一个按钮,上面写上返回顶部,把它的样式改成固定定位,之后想要 ...
- 原生js返回顶部
let backToTop = function() { let scrollToptimer = setInterval(function() { let top = document.body.s ...
- 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" ...
随机推荐
- Swift-Button 的 highlighted(高亮)
摘要 在学习小程序时,看到小程序中的一个样式属性 hover-class,通过设置这个属性,就可以给点击的控件添加一个高亮效果.所以也就萌生了在 Swift 也实现一个类似的功能的想法,开干. 下面代 ...
- vue 导出excel后端返回乱码下载不了的解析问题
有俩种方法可以用 第一种方法: 解析:直接解析并且下载后端的乱码 this.download('后端给的导出excel的方法', { ...this.queryParams }, ` ...
- python glob.glob()
glob()函数可以将某目录下所有跟通配符模式相同的文件放到一个列表中,有了这个函数,我们再想生成所有文件的列表就不需要使用for循环遍历目录了,直接使用glob.glob(path+pattern) ...
- shell脚本获取文件名、路径名、文件类型
1. 从字符串获取指定内容 从字符串中提取特定的信息,常用于获取文件名.文件类型.所在路径等. 1.1 获取字符串信息 用指定的方式(PATTERN)从字符串(PARAMETERS)中移除内容 &qu ...
- python模块--glob, fnmatch
包/方法 返回值 参数 说明 glob Unix shell样式的路径扩展 .glob() list 匹配满足规则的所有路径(默认以 . 开头的文件不会匹配到, 可以用 .* 来匹配) pat ...
- VB自制计算器
使用visual basic编写. 绘制如下的按钮界面: 然后代码如下: Dim a, temp, ans As Integer Dim op As String Sub showans() Text ...
- 分布式文件系统FastDFS在CentOS7上的安装及与Springboot的整合
1. 概述 FastDFS 是目前比较流行的分布式文件系统,可以很容易的实现横向扩展.动态扩容.灾备.高可用和负载均衡. FastDFS 的服务分为 tracker 服务 和 storage 服务, ...
- nginx 配置文件(支持thnkphp3.2~5)
server { listen 8080 ; server_name localhost; set $root /var/www/myweb; #listen 443 ssl; #ssl_certif ...
- P5540-[BalkanOI2011]timeismoney|最小乘积生成树【最小生成树,凸壳】
正题 题目链接:https://www.luogu.com.cn/problem/P5540 题目大意 给出\(n\)个点\(m\)条边边权是一个二元组\((a_i,b_i)\),求出一棵生成树最小化 ...
- P4451-[国家集训队]整数的lqp拆分【生成函数,特征方程】
正题 题目链接:https://www.luogu.com.cn/problem/P4451 题目大意 给出\(n\),对于所有满足\(\sum_{i=1}^ma_i=n\)且\(\forall a_ ...