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函数
Aug 01 Javascript
编写跨浏览器的javascript代码必备[js多浏览器兼容写法]
Oct 29 Javascript
js里怎么取select标签里的值并修改
Dec 10 Javascript
关于JavaScript中的关联数组分析
Apr 09 Javascript
js动态调用css属性的小规律及实例说明
Dec 28 Javascript
JavaScript实现简单的拖动效果
Jul 02 Javascript
JS上传图片预览插件制作(兼容到IE6)
Aug 07 Javascript
值得学习的bootstrap fileinput文件上传工具
Nov 08 Javascript
Bootstrap 3 按钮标签实例代码
Feb 21 Javascript
微信小程序 本地数据存储实例详解
Apr 13 Javascript
node-sass安装失败的原因与解决方法
Sep 04 Javascript
jQuery实现的简单对话框拖动功能示例
Jun 05 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
香妃
2021/03/03 冲泡冲煮
php addslashes 利用递归实现使用反斜线引用字符串
2013/08/05 PHP
PHP的PSR规范中文版
2013/09/28 PHP
关于js和php对url编码的处理方法
2014/03/04 PHP
php计算两个日期时间差(返回年、月、日)
2014/06/19 PHP
php 无限级分类 获取顶级分类ID
2016/03/13 PHP
微信公众平台开发教程②微信端分享功能图文详解
2019/04/10 PHP
ExtJS Ext.MessageBox.alert()弹出对话框详解
2010/04/02 Javascript
JS中怎样判断undefined(比较不错的方法)
2014/03/27 Javascript
jquery显示隐藏input对象
2014/07/21 Javascript
JavaScript实现控制打开文件另存为对话框的方法
2015/04/17 Javascript
Vue.js绑定HTML class数组语法错误的原因分析
2016/10/19 Javascript
jQuery获取this当前对象子元素对象的方法
2016/11/29 Javascript
DOM 事件的深入浅出(一)
2016/12/05 Javascript
JS中的数组转变成JSON格式字符串的方法
2017/05/09 Javascript
详解在AngularJS的controller外部直接获取$scope
2017/06/02 Javascript
es7学习教程之fetch解决异步嵌套问题的方法示例
2017/07/21 Javascript
Scala解析Json字符串的实例详解
2017/10/11 Javascript
微信小程序显示倒计时功能示例【测试可用】
2018/12/03 Javascript
微信小程序如何调用json数据接口并解析
2019/06/29 Javascript
JavaScript的console命令使用实例
2019/12/03 Javascript
javascript实现点击小图显示大图
2020/11/29 Javascript
Python3搜索及替换文件中文本的方法
2015/05/22 Python
python算法表示概念扫盲教程
2017/04/13 Python
解决Ubuntu pip 安装 mysql-python包出错的问题
2018/06/11 Python
对TensorFlow中的variables_to_restore函数详解
2018/07/30 Python
Python列表倒序输出及其效率详解
2020/03/04 Python
css3截图_动力节点Java学院整理
2017/07/11 HTML / CSS
html5小程序飞入购物车(抛物线绘制运动轨迹点)
2020/10/19 HTML / CSS
银行求职推荐信范文
2013/11/30 职场文书
工伤事故赔偿协议书
2014/10/27 职场文书
2015年禁毒工作总结
2015/04/30 职场文书
保护地球的宣传语
2015/07/13 职场文书
小学2016年“我们的节日·重阳节”活动总结
2016/04/01 职场文书
靠谱准确的求职信
2019/04/02 职场文书
科学家研发出新型速效酶,可在 24 小时内降解塑料制品
2022/04/29 数码科技