js讓一行頁腳保持在底部
更新時(shí)間:2008年04月11日 19:46:46 作者:
所謂保持在底部就是: 在內(nèi)容不超過一屏的情況下, 當(dāng)瀏覽器窗口變小那行頁腳文字會(huì)跟著向上浮動(dòng)但還是保持在底部。當(dāng)內(nèi)容多出一屏?xí)r,他顯示在網(wǎng)頁的最下邊,而不是窗口的最下邊;
測了一下,還可以,在IE6、IE7、FIREOFX等都沒有問題! 窗口縮小時(shí)也沒有問題!
<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ù)覽的大圖提示效果
這篇文章主要介紹了如何實(shí)現(xiàn)鼠標(biāo)滑過出現(xiàn)預(yù)覽的大圖提示效果,需要的朋友可以參考下2014-02-02利用JS定時(shí)器實(shí)現(xiàn)元素移動(dòng)
這篇文章主要為大家詳細(xì)介紹了利用JS定時(shí)器實(shí)現(xiàn)元素移動(dòng),文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-05-05fullPage.js和CSS3實(shí)現(xiàn)全屏滾動(dòng)效果
這篇文章主要為大家詳細(xì)介紹了fullPage.js和CSS3實(shí)現(xiàn)全屏滾動(dòng)效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-05-05Javascript的表單與驗(yàn)證-非空驗(yàn)證
JavaScript 可用來在數(shù)據(jù)被送往服務(wù)器前對(duì) HTML 表單中的這些輸入數(shù)據(jù)進(jìn)行驗(yàn)證。本文給大家介紹javascript的表單與驗(yàn)證-非空驗(yàn)證,對(duì)javascript表單驗(yàn)證相關(guān)知識(shí)感興趣的朋友一起學(xué)習(xí)吧2016-03-03JavaScript實(shí)現(xiàn)旋轉(zhuǎn)木馬輪播圖
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)旋轉(zhuǎn)木馬輪播圖,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-03-03js清空表單數(shù)據(jù)的兩種方式(遍歷+reset)
這篇文章主要介紹了js清空表單數(shù)據(jù)的兩種方式(遍歷+reset),需要的朋友可以參考下2014-07-07javascript獲取重復(fù)次數(shù)最多的字符
本文給大家講述的是使用javascript實(shí)現(xiàn)獲取重復(fù)次數(shù)最多的字符,代碼很簡單,有需要的小伙伴可以參考下。2015-07-07