js style动态设置table高度


Posted in Javascript onOctober 21, 2014

直接在table标签中设置下不就行了吗?这是静态的,如果要动态设置你会吗?

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);
}
Javascript 相关文章推荐
jquery uaMatch源代码
Feb 14 Javascript
JavaScript用Number方法实现string转int
May 13 Javascript
javascript的switch用法注意事项分析
Feb 02 Javascript
jQuery实现精美的多级下拉菜单特效
Mar 14 Javascript
深入理解JS addLoadEvent函数
May 20 Javascript
JavaScript如何实现跨域请求
Aug 05 Javascript
js Canvas绘制圆形时钟教程
Feb 06 Javascript
javascript 中设置window.location.href跳转无效问题解决办法
Feb 09 Javascript
一个Vue页面的内存泄露分析详解
Jun 25 Javascript
element-ui 的el-button组件中添加自定义颜色和图标的实现方法
Oct 26 Javascript
JS实现灯泡开关特效
Mar 30 Javascript
搭建vscode+vue环境的详细教程
Aug 31 Javascript
js读写json文件实例代码
Oct 21 #Javascript
一个JavaScript防止表单重复提交的实例
Oct 21 #Javascript
javascript Deferred和递归次数限制实例
Oct 21 #Javascript
JQuery的Ajax中Post方法传递中文出现乱码的解决方法
Oct 21 #Javascript
jquery中post方法用法实例
Oct 21 #Javascript
js调试工具Console命令详解
Oct 21 #Javascript
JS中FRAME的操作问题实例分析
Oct 21 #Javascript
You might like
Apache2 httpd.conf 中文版
2006/12/06 PHP
PHP 实现判断用户是否手机访问
2015/01/21 PHP
Yii2组件之多图上传插件FileInput的详细使用教程
2016/06/20 PHP
PHP魔术方法之__call与__callStatic使用方法
2017/07/23 PHP
laravel如何开启跨域功能示例详解
2017/08/31 PHP
php中如何执行linux命令详解
2018/11/06 PHP
laravel 修改记住我功能的cookie保存时间的方法
2019/10/14 PHP
一种JavaScript的设计模式
2006/11/22 Javascript
JS中令人发指的valueOf方法介绍
2013/02/22 Javascript
jquery中focus()函数实现当对象获得焦点后自动把光标移到内容最后
2013/09/29 Javascript
javascript替换已有元素replaceChild()使用介绍
2014/04/03 Javascript
了不起的node.js读书笔记之mongodb数据库交互
2014/12/22 Javascript
基于jquery实现日历签到功能
2020/09/11 Javascript
AngularJS仿苹果滑屏删除控件
2016/01/18 Javascript
微信小程序 数组(增,删,改,查)等操作实例详解
2017/01/05 Javascript
微信小程序实现移动端滑动分页效果(ajax)
2017/06/13 Javascript
详解webpack 如何集成第三方js库
2017/06/29 Javascript
AngularJS中使用three.js的实例详解
2017/07/21 Javascript
tween.js缓动补间动画算法示例
2018/02/13 Javascript
vue实现学生录入系统之添加删除功能
2018/07/11 Javascript
微信小程序中的店铺评分组件及vue中用svg实现的评分显示组件
2018/11/16 Javascript
从零开始在NPM上发布一个Vue组件的方法步骤
2018/12/20 Javascript
nodeJS进程管理器pm2的使用
2019/01/09 NodeJs
ES6 Iterator接口和for...of循环用法分析
2019/07/31 Javascript
通过扫小程序码实现网站登陆功能
2019/08/22 Javascript
9种方法优化jQuery代码详解
2020/02/04 jQuery
在vue中使用eslint,配合vscode的操作
2020/11/09 Javascript
浅谈Python中函数的参数传递
2016/06/21 Python
Python中asyncore异步模块的用法及实现httpclient的实例
2016/06/28 Python
python ETL工具 pyetl
2020/06/07 Python
wedgwood加拿大官网:1759年成立的英国国宝级陶瓷餐具品牌
2018/07/17 全球购物
如何用PHP实现邮件发送
2012/12/26 面试题
道德之星事迹材料
2014/05/03 职场文书
股指期货心得体会
2014/09/10 职场文书
2016廉洁教育心得体会
2016/01/20 职场文书
使用python求解迷宫问题的三种实现方法
2022/03/17 Python