久久无码中文字幕_日韩精品无码一本二本三_久久精品呦女暗网_欧美一级夜夜爽_久久精品国产99久久99久久久

10
2017/02

導(dǎo)航跟隨滾動(dòng)條懸浮是怎么來使用的

發(fā)布時(shí)間:2017-02-10 16:03:46
發(fā)布者:369563174
瀏覽量:
0

有些網(wǎng)站當(dāng)你滾動(dòng)到一定的位置之后,導(dǎo)航條會(huì)懸浮或者是換另外一種樣式出現(xiàn)在最頂部,他是怎么來實(shí)現(xiàn),比如我們的馬紅旗小兒推拿項(xiàng)目中,導(dǎo)航就用到了跟隨滾動(dòng)條懸?。?/p>

圖片4.png

這個(gè)效果特別簡(jiǎn)單,他是這么來實(shí)現(xiàn)的:

首先引入jquery:

圖片5.png

然后用jquery代碼來控制他:

    



當(dāng)然你得有寫好的樣式:

      

 

當(dāng)滾動(dòng)條從最頂端滾動(dòng)到120像素的時(shí)候,給header追加dingwei這個(gè)class,然后他就懸浮了,當(dāng)然當(dāng)你滾動(dòng)回去的時(shí)候肯定得恢復(fù)他原來的樣子,那么就用removeCLass把dingwei這個(gè)類名給移除掉就可以了,這樣導(dǎo)航跟隨滾動(dòng)條懸浮就實(shí)現(xiàn)了。


返回列表