【JavaScript】给你的网站加一个简单的返回顶部
JavaScript网站 简单 一个 返回 顶部
2023-06-13 09:17:36 时间
工具:灵巧的小手 要实现的功能分别为: 1.当滑动到一定位置,返回顶部按钮的显示与消失。(用if判断) 2.点击返回顶部按钮,返回到顶部。(使用window.scroll(0,0))
css和html部分:
首先我们的页面需要一个返回顶部的按钮,用户用来点击(必须使用固定定位定位不然它就跟页面走了,然后在css中让它的display: none;)。
js部分:
获取按钮,body主页高度,通过window.pageYOffset 获取滑动的高度, 滑动大于1/3时,让它显示,小于隐藏 点击返回顶部使用window.scroll(0,0)
温馨提示:本文最后更新于2021-11-18
,若文件或内容有错误或已失效,请在下方留言。
相关文章
- 【说站】javascript组合继承是什么
- 【说站】javascript中字典如何理解
- 【说站】javascript加法如何使用
- HTML5期末大作业:大学生个人网站设计——我们的班级(7页) HTML+CSS+JavaScript 学生DW网页设计作业成品 html网页制作代码大全 html5网页设计作业代码
- javascript html转换成markdown,如何使用Turndown使用JavaScript将HTML转换为Markdown[通俗易懂]
- javascript-继承之jquery
- Web-JavaScript
- 网站中引入了多个版本的 JavaScript 库防止对象冲突的方法 - 在线客服系统源码
- javascript(一)详解编程语言
- Javascript中eval函数的详细用法与说明
- Javascript更新JavaScript数组的uniq方法
- Javascript阻止javascript事件冒泡,获取控件ID值
- javascript操作Word和Excel的实现代码
- JavaScript设计模式富有表现力的Javascript(一)
- javascript重写alert方法的实例代码
- javascript实现的平方米、亩、公顷单位换算小程序