js style動(dòng)態(tài)設(shè)置table高度
更新時(shí)間：2014年10月21日 17:20:16 投稿：whsnow
設(shè)置table高度想必大家都會(huì)，直接在table標(biāo)簽中設(shè)置下不就行了嗎？這是靜態(tài)的，如果要?jiǎng)討B(tài)設(shè)置你會(huì)嗎？下面的實(shí)例將教會(huì)大家
直接在table標(biāo)簽中設(shè)置下不就行了嗎？這是靜態(tài)的，如果要?jiǎng)討B(tài)設(shè)置你會(huì)嗎？
function com_onresize(){
var contentsHeight = document.body.clientHeight;
var buttonsHeight = document.getElementById( "buttons" ).offsetHeight;
var head1Height = document.getElementById( "head1" ).offsetHeight;
var head2Height = document.getElementById( "head2" ).offsetHeight;
var t1 = document.getElementById( "TableContainer1" ).style.height;
var t2 = document.getElementById( "TableContainer2" ).style.height;
//alert(document.getElementById( "TableContainer1" ).style.height);
var h = contentsHeight - buttonsHeight - head1Height - head2Height - 13;
if(h < 110){
return;
}
document.getElementById( "TableContainer1" ).style.height = h/2 + 'px';
document.getElementById( "TableContainer2" ).style.height = h/2 + 'px';
}
function com_sbs_pagesize(){
var screenHeight = window.screen.height;
var availHeight = window.screen.availHeight;
//alert(document.getElementById( "TableContainer1" ).children[0].rows.length);
var index = document.getElementById( "TableContainer1" ).children[0].rows.length
var buttonsHeight = document.getElementById( "buttons" ).offsetHeight;
var head1Height = document.getElementById( "head1" ).offsetHeight;
var head2Height = document.getElementById( "head2" ).offsetHeight;
var mainH = buttonsHeight + head1Height +head2Height + 13;
//20:scroll 35:title 25:tr
while ((availHeight-mainH) < (20 + 35 + 25*index)*2)
{
index = index - 1;
}
var tableHeight = 20 + 35 + 25*index;
document.getElementById( "TableContainer1" ).style.height = tableHeight + 'px';
document.getElementById( "TableContainer2" ).style.height = tableHeight + 'px';
window.resizeTo(document.body.offsetWidth,mainH + tableHeight*2);
}
相關(guān)文章
js實(shí)現(xiàn)對(duì)table的增加行和刪除行的操作方法
下面小編就為大家?guī)?lái)一篇js實(shí)現(xiàn)對(duì)table的增加行和刪除行的操作方法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-10-10
客戶(hù)端限制只能上傳jpg格式圖片的js代碼,對(duì)用戶(hù)體驗(yàn)較好，適合網(wǎng)頁(yè)中只能使用jpg格式圖片的情況。2010-12-12
本篇文章是對(duì)JavaScript禁止頁(yè)面操作的示例代碼進(jìn)行了介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助2013-12-12
bootstrap Table服務(wù)端處理分頁(yè)(后臺(tái)是.net)
這篇文章主要為大家詳細(xì)介紹了bootstrap Table服務(wù)端處理分頁(yè)，后臺(tái)是.net，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-10-10
這篇文章主要介紹了Javascript對(duì)象按照屬性排序方法示例探究,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2024-01-01
如何使用JavaScript實(shí)現(xiàn)棧與隊(duì)列
這篇文章主要介紹了如何使用JavaScript實(shí)現(xiàn)棧與隊(duì)列。棧和隊(duì)列是web開(kāi)發(fā)中最常用的兩種數(shù)據(jù)結(jié)構(gòu)。絕大多數(shù)用戶(hù)，甚至包括web開(kāi)發(fā)人員，都不知道這個(gè)驚人的事實(shí)。,需要的朋友可以參考下2019-06-06
使用openSpeDiv方法實(shí)現(xiàn)Ecshop登錄彈窗框效果
在ECSHOP的目錄/JS/common.js中有一個(gè)openSpeDiv方法是實(shí)現(xiàn)ECSHOP的彈窗效果的。接下來(lái)通過(guò)本文給大家分享使用openSpeDiv方法實(shí)現(xiàn)Ecshop登錄彈窗框效果，需要的朋友參考下2017-03-03
Markdown+Bootstrap圖片自適應(yīng)屬性詳解
這篇文章主要為大家詳細(xì)介紹了Markdown+Bootstrap圖片自適應(yīng)屬性，感興趣的朋友可以參考一下2016-05-05
bootstrap-table組合表頭的實(shí)現(xiàn)方法
本篇文章主要介紹了bootstrap-table組合表頭的實(shí)現(xiàn)方法，非常具有實(shí)用價(jià)值，需要的朋友可以參考下2017-09-09
這篇文章主要為大家詳細(xì)介紹了js仿淘寶和百度文庫(kù)的評(píng)分功能的相關(guān)代碼和實(shí)現(xiàn)思路,具有一定的參考價(jià)值，需要的朋友可以參考下2016-05-05