标签:play func scrolltop top add span utf-8 pat pad
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> *{ padding: 0; margin: 0; } #dv1{ width: 100%; height: 500px; background: red; } #uu{ width: 100%; height: 100px; background: blueviolet; display: flex; } #uu li{ width: 20%; height: 100px; background: fuchsia; border: 2px solid blue; text-align: center; line-height: 100px; font-size: 20px; list-style: none; /* display: flex; flex-wrap: nowrap; */ } #dv2{ width: 100%; height: 1500px; background: chartreuse; } .fixed{ position: fixed; top: 0; left: 0; } </style> </head> <body> <div id="dv1"></div> <ul id="uu" class="uu1"> <li>新闻</li> <li>娱乐</li> <li>财经</li> <li>军事</li> <li>国际</li> </ul> <div id="dv2"> <img src="img/wenshen.jpg" width="100%" height="1500px "> </div> <script src="common.js"></script> <script> function feng() { return { top: window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0, left: window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0 } } window.onscroll = function(){ if(feng().top >= my$(‘dv1‘).offsetHeight){ my$(‘uu‘).className = ‘uu1 fixed‘; //my$(‘dv2‘).style.marginTop = my$(‘dv1‘).offsetHeight + 10 +‘px‘; } else{ my$(‘uu‘).className = ‘uu1‘; my$(‘dv2‘).style.marginTop = ‘10px‘; } } </script> </body> </html>
标签:play func scrolltop top add span utf-8 pat pad
原文地址:https://www.cnblogs.com/fengdashuai/p/11205706.html