js讓一行頁腳保持在底部
更新時間:2008年04月11日 19:46:46 作者:
所謂保持在底部就是: 在內(nèi)容不超過一屏的情況下, 當(dāng)瀏覽器窗口變小那行頁腳文字會跟著向上浮動但還是保持在底部。當(dāng)內(nèi)容多出一屏?xí)r,他顯示在網(wǎng)頁的最下邊,而不是窗口的最下邊;
測了一下,還可以,在IE6、IE7、FIREOFX等都沒有問題! 窗口縮小時也沒有問題!
<script language="JavaScript" type="text/javascript">
function test(){
var infoHeight = document.getElementById("info").scrollHeight;
var bottomHeight = document.getElementById("bottom").scrollHeight;
var allHeight = document.documentElement.clientHeight;
var bottom = document.getElementById("bottom");
if((infoHeight + bottomHeight) < allHeight){
bottom.style.position = "absolute";
bottom.style.bottom = "0";
}else{
bottom.style.position = "";
bottom.style.bottom = "";
}
setTimeout(function(){test();},10);
}
test();
</script>
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
復(fù)制代碼 代碼如下:
<script language="JavaScript" type="text/javascript">
function test(){
var infoHeight = document.getElementById("info").scrollHeight;
var bottomHeight = document.getElementById("bottom").scrollHeight;
var allHeight = document.documentElement.clientHeight;
var bottom = document.getElementById("bottom");
if((infoHeight + bottomHeight) < allHeight){
bottom.style.position = "absolute";
bottom.style.bottom = "0";
}else{
bottom.style.position = "";
bottom.style.bottom = "";
}
setTimeout(function(){test();},10);
}
test();
</script>
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
相關(guān)文章
鼠標(biāo)滑過出現(xiàn)預(yù)覽的大圖提示效果
這篇文章主要介紹了如何實現(xiàn)鼠標(biāo)滑過出現(xiàn)預(yù)覽的大圖提示效果,需要的朋友可以參考下2014-02-02fullPage.js和CSS3實現(xiàn)全屏滾動效果
這篇文章主要為大家詳細(xì)介紹了fullPage.js和CSS3實現(xiàn)全屏滾動效果,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-05-05JavaScript實現(xiàn)旋轉(zhuǎn)木馬輪播圖
這篇文章主要為大家詳細(xì)介紹了JavaScript實現(xiàn)旋轉(zhuǎn)木馬輪播圖,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下2020-03-03js清空表單數(shù)據(jù)的兩種方式(遍歷+reset)
這篇文章主要介紹了js清空表單數(shù)據(jù)的兩種方式(遍歷+reset),需要的朋友可以參考下2014-07-07javascript獲取重復(fù)次數(shù)最多的字符
本文給大家講述的是使用javascript實現(xiàn)獲取重復(fù)次數(shù)最多的字符,代碼很簡單,有需要的小伙伴可以參考下。2015-07-07