鼠标下滑到一定的高度时二级导航条固定在顶部

Posted 封寻丸子

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了鼠标下滑到一定的高度时二级导航条固定在顶部相关的知识,希望对你有一定的参考价值。

css样式:

.fixednav{

position:fixed;

top:0px;

left:0;

width:100%;

z-index:1;

}

jQuery js结构:

$(function(){

var nav=$(".nav");//获取当前对象

var win =$(windows);//获取窗口

var do=$(document);

win.scroll(function(){

if(do.scrollTop()>=100){ nav.addClass("fixednav");

$(".navTmp").fadeIn();

}else{

nav.removeClass("fixednav");

$(".navTmp").fadeOut(); } })

})

//nav改成自定义的导航的class

以上是关于鼠标下滑到一定的高度时二级导航条固定在顶部的主要内容,如果未能解决你的问题,请参考以下文章

React实现顶部固定滑动式导航栏(导航条下拉一定像素时显示原导航栏样式)

小程序固定导航栏在顶部,跟随下滑

BootStrap实用代码片段(持续总结)

导航栏下拉至一定高度后固定在顶部的特效

垂直滚动条滑到页面里面的导航栏时,导航栏固定到窗口顶部

页面布局