首页 发现 帮助
登录
lovecoding
/
web0715
10
0
派生 0
文件 工单管理 0 Wiki
浏览代码

add

fengchuanyu 8 月之前
父节点
c598efa8c4
当前提交
a0f6a33e96
共有 4 个文件被更改，包括 29 次插入 和 1 次删除
合并视图 显示文件统计
  1. 26 0
      8_移动端/8_页面滚动.html
  2. 二进制
      8_移动端/img/move2.jpg
  3. 二进制
      8_移动端/img/v2dimax.png
  4. 3 1
      8_移动端/练习题4_猫眼电影移动端.html

+ 26 - 0
8_移动端/8_页面滚动.html
查看文件 

@@ -21,11 +21,37 @@
 
           width: 0;
 
           width: 0;
 
           height: 0;  
           height: 0;  
         }
 
         }
 
+        .box{
 
+            width: 100px;
 
+            height: 1000px;
 
+            background-image: linear-gradient(to bottom,red,green);
 
+        }
 
     </style>
 
     </style>
 
 </head>
 
 </head>
 
 <body>
 
 <body>
 
     <div class="div1">
 
     <div class="div1">
 
         <div class="div2"></div>
 
         <div class="div2"></div>
 
     </div>
 
     </div>
 
+    <div class="box">
 
+
 
+    </div>
 
+    <button onclick="backtop()">返回顶部</button>
 
+    <script>
 
+        window.onscroll = function(){
 
+            // console.log("scroll");
 
+            console.log("滚动距离顶部距离",document.documentElement.scrollTop);
 
+            console.log("可滚动区域高度",document.documentElement.scrollHeight);
 
+            console.log("视口高度",document.documentElement.clientHeight);
 
+
 
+        }
 
+        function backtop(){
 
+            console.log("com")
 
+            // window.scrollTo(0,0)
 
+            window.scrollTo({
 
+                top:0,
 
+                behavior:"smooth"
 
+            })
 
+        }
 
+    </script>
 
 </body>
 
 </body>
 
 </html>
 
 </html>

二进制
8_移动端/img/move2.jpg
查看文件


二进制
8_移动端/img/v2dimax.png
查看文件


+ 3 - 1
8_移动端/练习题4_猫眼电影移动端.html
查看文件 

@@ -372,7 +372,9 @@
 
                     </li>
 
                     </li>
 
                 </ul>    
                 </ul>    
             </div>
 
             </div>
 
-            <div class="move-list"></div>
 
+            <div class="move-list">
 
+                
+            </div>
 
         </div>
 
         </div>
 
         <div class="bottom-nav">
 
         <div class="bottom-nav">
 
             <ul>
 
             <ul>