HTML5將footer置于頁(yè)面最底部的方法(CSS+JS)
JavaScript:
<script type="text/javascript"> $(function(){ function footerPosition(){ $("footer").removeClass("fixed-bottom"); //网页正文全文高度 var contentHeight = document.body.scrollHeight, //可视窗口高度,不包括浏览器顶部工具栏 winHeight = window.innerHeight; if(!(contentHeight > winHeight)){ //当网页正文高度小于可视窗口高度时,为footer添加类fixed-bottom $("footer").addClass("fixed-bottom"); } else { $("footer").removeClass("fixed-bottom"); } } footerPosition(); $(window).resize(footerPosition); });</script>
CSS:
.fixed-bottom { position: fixed; bottom: 0; width:100%; }
作者:linwene
链接:https://www.jianshu.com/p/f730e275e2c1
點(diǎn)擊查看更多內(nèi)容
為 TA 點(diǎn)贊
評(píng)論
評(píng)論
共同學(xué)習(xí),寫(xiě)下你的評(píng)論
評(píng)論加載中...
作者其他優(yōu)質(zhì)文章
正在加載中
感謝您的支持,我會(huì)繼續(xù)努力的~
掃碼打賞,你說(shuō)多少就多少
贊賞金額會(huì)直接到老師賬戶
支付方式
打開(kāi)微信掃一掃,即可進(jìn)行掃碼打賞哦
今天注冊(cè)有機(jī)會(huì)得
100積分直接送
付費(fèi)專(zhuān)欄免費(fèi)學(xué)
大額優(yōu)惠券免費(fèi)領(lǐng)