js:
var windowTop = 0;$(window).scroll(function() { var scrolls = $(this).scrollTop(); if(scrolls <= 0) { $("header").removeClass("showFixed").css({ "top": "43px" }) } else { if(scrolls >= windowTop) { windowTop = scrolls; var screenWidth=$(document).width; if(screenWidth>768){ $("header").removeClass("showFixed").addClass("hiddenFixed").css({ "top": "-113.72px" }) }else{ $("header").removeClass("showFixed").addClass("hiddenFixed").css({ "top": "-245.72px" }) } } else { windowTop = scrolls; $("header").addClass("showFixed").removeClass("hiddenFixed").css({ "top": "0px" }) } }});
css:
header{ background-color: rgba(0, 117, 193, 0.84); right: 0; left: 0; top: 0; transition: top 0.5s; z-index: 999;}.hiddenFixed{ position: fixed; width: 100%; top: 0;}.showFixed{ position: fixed; width: 100%; top: 0;}
转载于:https://www.cnblogs.com/sqyambition/p/9341539.html
