如何通过JS/CSS实现网页返回顶部效果

这篇文章给大家分享的是有关如何通过JS/CSS实现网页返回顶部效果的内容。小编觉得挺实用的，因此分享给大家做个参考，一起跟随小编过来看看吧。CSS 按钮样式：#myBtn {display: none; /* 默认隐藏 */position: fixed;bottom: 20px;right: 30px;z-index: 99;border: n免费云主机、域名one;outline: none;background-color: red; /* 设置背景颜色，你可以设置自己想要的颜色或图片 */color: white; /* 文本颜色 */cursor: pointer;padding: 15px;border-radius: 10px; /* 圆角 */}#myBtn:hover {background-color: #555;}JS 代码：// 当网页向下滑动 20px 出现”返回顶部” 按钮window.onscroll = function() {scrollFunction()};function scrollFunction() {console.log(121);if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {document.getElementById(“myBtn”).style.display = “block”;} else {document.getElementById(“myBtn”).style.display = “none”;}}// 点击按钮，返回顶部function topFunction() {document.body.scrollTop = 0;document.documentElement.scrollTop = 0;}感谢各位的阅读！关于“如何通过JS/CSS实现网页返回顶部效果”这篇文章就分享到这里了，希望以上内容可以对大家有一定的帮助，让大家可以学到更多知识，如果觉得文章不错，可以把它分享出去让更多的人看到吧！

相关推荐: CSS中怎么定义多种样式

这篇文章主要介绍“CSS中怎么定义多种样式”，在日常操作中，相信很多人在CSS中怎么定义多种样式问题上存在疑惑，小编查阅了各式资料，整理出简单好用的操作方法，希望对大家解答”CSS中怎么定义多种样式”的疑惑有所帮助！接下来，请跟着小编一起来学习吧！ 或许为一个…