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 相关文章推荐
理解Javascript_08_函数对象
Oct 15 Javascript
Jqgrid设置全选(选择)及获取选择行的值示例代码
Dec 28 Javascript
深入理解JavaScript系列(40):设计模式之组合模式详解
Mar 04 Javascript
JS实现带圆弧背景渐变效果的导航菜单代码
Oct 13 Javascript
Bootstrap文件上传组件之bootstrap fileinput
Nov 25 Javascript
使用ionic在首页新闻中应用到的跑马灯效果的实现方法
Feb 13 Javascript
浅谈js中用$(#ID)来作为选择器的问题(id重复的时候)
Feb 14 Javascript
利用n 升级工具升级Node.js版本及在mac环境下的坑
Feb 15 Javascript
详解angularJS自定义指令间的相互交互
Jul 05 Javascript
详解使用jQuery.i18n.properties实现js国际化
May 04 jQuery
jQuery模拟12306城市选择框功能简单实现方法示例
Aug 13 jQuery
jQuery实现查看图片功能
Dec 01 jQuery
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
MySQL时间字段究竟使用INT还是DateTime的说明
2012/02/27 PHP
php实现统计邮件大小的方法
2013/08/06 PHP
php 使用file_get_contents读取大文件的方法
2014/11/13 PHP
自制PHP框架之路由与控制器
2017/05/07 PHP
ThinkPHP 框架实现的读取excel导入数据库操作示例
2020/04/14 PHP
Jquery替换已存在于element上的event的方法
2010/03/09 Javascript
Jquery中对数组的操作代码
2011/08/12 Javascript
jQuery.extend()的实现方式详解及实例
2013/06/29 Javascript
JavaScript中的console.trace()函数介绍
2014/12/29 Javascript
JS动态创建DOM元素的方法
2015/06/09 Javascript
JS实现选项卡实例详解
2015/11/17 Javascript
js基于setTimeout与setInterval实现多线程
2016/06/17 Javascript
JavaScript时间戳与时间日期间相互转换
2017/12/11 Javascript
vue click.stop阻止点击事件继续传播的方法
2018/09/04 Javascript
如何自动化部署项目?折腾服务器之旅~
2019/04/16 Javascript
微信小程序实现判断是分享到群还是个人功能示例
2019/05/03 Javascript
JS基础之逻辑结构与循环操作示例
2020/01/19 Javascript
[01:17]辉夜杯战队访谈宣传片—EHOME
2015/12/25 DOTA
Python利用operator模块实现对象的多级排序详解
2017/05/09 Python
Python中Scrapy爬虫图片处理详解
2017/11/29 Python
对python 各种删除文件失败的处理方式分享
2018/04/24 Python
Python动态生成多维数组的方法示例
2018/08/09 Python
python2和python3的输入和输出区别介绍
2018/11/20 Python
Python3获取拉勾网招聘信息的方法实例
2019/04/03 Python
Python用字典构建多级菜单功能
2019/07/11 Python
django 多对多表的创建和插入代码实现
2019/09/09 Python
Ubuntu下Python+Flask分分钟搭建自己的服务器教程
2019/11/19 Python
PyQt5实现简单的计算器
2020/05/30 Python
俄罗斯有趣和原创礼物网上商店:MagicMag
2019/08/01 全球购物
Cult Gaia官网:美国生活方式品牌
2019/08/16 全球购物
存储过程的优点有哪些
2012/09/27 面试题
2019史上最全Database工程师题库
2015/12/06 面试题
医院领导班子整改方案
2014/10/01 职场文书
个人批评与自我批评范文
2014/10/17 职场文书
2015年财务人员工作总结
2015/04/10 职场文书
实习报告范文之电话客服岗位
2019/07/26 职场文书