js返回顶部按钮

返回顶部模块

你可以使用 JavaScript 和 CSS 来实现滚动到底部时显示侧边栏,并点击返回顶部按钮返回页面顶部的效果。下面是一个简单的示例代码:

HTML:

DOCTYPE html>
<html>
<head>
  <style>
    #sidebar {
      position: fixed;
      top: 50%;
      right: 10px;
      transform: translateY(-50%);
      width: 100px;
      height: 200px;
      background-color: #ccc;
      display: none;
    }

    #backToTop {
      position: fixed;
      bottom: 20px;
      right: 20px;
      display: none;
    }
  style>
head>
<body>
  <div id="sidebar">侧边栏内容div>
  <button id="backToTop">返回顶部button>

  
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed eu risus vel arcu gravida iaculis. Ut fringilla semper tellus vitae ornare. Donec fermentum mauris in nisl ullamcorper, eget mollis nunc viverra. Quisque luctus enim a finibus cursus. Nam tincidunt nulla non efficitur ultrices. Phasellus nec ligula vel metus rutrum malesuada.p>
  <p>Curabitur non dignissim eros. Nullam tempor mauris lectus, iaculis pellentesque erat posuere cursus. Proin elementum ex a urna cursus, ut malesuada turpis eleifend. Sed varius sem et imperdiet tempor. Fusce ac semper enim.p>
  

  <script src="script.js">script>
body>
html>

JavaScript(在

你可能感兴趣的:(javascript,开发语言,ecmascript)