导航栏滚动到一定高度改变背景色JS代码

2019-04-03 浏览:647
导航栏滚动到一定高度改变背景色JS代码
评论:(0)复制地址

html代码

<header id="header">...</header>


Js代码

$(function () {
  $(window).scroll(function () {
   100 < $(this).scrollTop() ? $("#header").addClass('navbg') : $("#header").removeClass('navbg');
  });
 });


CSS代码

#header{position:fixed;top:0;left:0;width:100%;z-index:100;-webkit-transition: background .4s ease-in-out; -moz-transition: background .4s ease-in-out; -o-transition: background .4s ease-in-out; transition: background .4s ease-in-out;background:0}


.navbg{background:rgba(0,0,0,.5)!important}

评论:(0)复制地址
发布:苗景云 | 分类:IT技术&设计 | Tags:JS

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。