導(dǎo)航欄

.navigation {position: fixed;bottom: 100px;right: 100px;z-index: 100; } .navigation {transition: bottom 2s;-webkit-transition: bottom 2s; }

JQ代碼

var nav = eval($('.navigation').offset().top - $(window).scrollTop()); $(window).on('scroll', function() {var navh = $('.navigation').height();var foot = parseInt($('.footer').offset().top - $(this).scrollTop() - navh);/*console.log(nav - foot);*/if(nav == foot || nav > foot) {$('.navigation').css({'position': 'fixed','bottom': '400px'});} else {$('.navigation').css({'position': 'fixed','bottom': '100px'});} });
更多專業(yè)前端知識(shí)，請(qǐng)上 【猿2048】www.mk2048.com

總結(jié)

以上是生活随笔為你收集整理的JQ css3 导航栏到底部上移的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。