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 相关文章推荐
js和php如何获取当前url的内容
Sep 22 Javascript
javascript实现切换td中的值
Dec 05 Javascript
JavaScript中的包装对象介绍
Jan 27 Javascript
Bootstrap布局组件应用实例讲解
Feb 17 Javascript
jquery实现刷新随机变化样式特效(tag标签样式)
Feb 03 Javascript
mui开发中获取单选按钮、复选框的值(实例讲解)
Jul 24 Javascript
在 Angular 中使用Chart.js 和 ng2-charts的示例代码
Aug 17 Javascript
微信小程序实现tab切换效果
Nov 21 Javascript
node.js中TCP Socket多进程间的消息推送示例详解
Jul 10 Javascript
Nuxt配合Node在实际生产中的应用详解
Aug 07 Javascript
vue 强制组件重新渲染(重置)的两种方案
Oct 29 Javascript
JS call()及apply()方法使用实例汇总
Jul 11 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
DOTA2 6.87版本后新眼位详解攻略
2020/04/20 DOTA
php中print(),print_r(),echo()的区别详解
2014/12/01 PHP
js中设置元素class的三种方法小结
2011/08/28 Javascript
jQuery EasyUI API 中文文档 搜索框
2011/09/29 Javascript
JQueryEasyUI Layout布局框架的使用
2013/04/08 Javascript
ajax提交表单实现网页无刷新注册示例
2014/05/08 Javascript
JS实现统计复选框选中个数并提示确定与取消的方法
2015/07/01 Javascript
bootstrap datetimepicker2.3.11时间插件使用
2016/11/19 Javascript
基于jQuery实现顶部导航栏功能
2016/12/27 Javascript
Bootstrap进度条与AJAX后端数据传递结合使用实例详解
2017/04/23 Javascript
Vue2.0实现购物车功能
2017/06/05 Javascript
浅谈Angular 的变化检测的方法
2018/03/01 Javascript
了解ESlint和其相关操作小结
2018/05/21 Javascript
chosen实现省市区三级联动
2018/08/16 Javascript
layui框架table 数据表格的方法级渲染详解
2018/08/19 Javascript
Vue使用Canvas绘制图片、矩形、线条、文字,下载图片
2019/04/26 Javascript
浅谈Vue SSR中的Bundle的具有使用
2019/11/21 Javascript
Vue 组件注册全解析
2020/12/17 Vue.js
Django admin美化插件suit使用示例
2017/12/12 Python
Python3实现发送QQ邮件功能(附件)
2020/12/23 Python
Pandas DataFrame 取一行数据会得到Series的方法
2018/11/10 Python
python的继承知识点总结
2018/12/10 Python
Python+opencv 实现图片文字的分割的方法示例
2019/07/04 Python
python 利用pyttsx3文字转语音过程详解
2019/09/25 Python
python如何调用字典的key
2020/05/25 Python
Scrapy框架介绍之Puppeteer渲染的使用
2020/06/19 Python
python re模块常见用法例举
2021/03/01 Python
使用CSS3 制作一个material-design 风格登录界面实例
2016/12/12 HTML / CSS
美国花园雕像和家居装饰网上商店:Design Toscano
2019/03/09 全球购物
写一个方法,输入一个文件名和一个字符串,统计这个字符串在这个文件中出现的次数
2016/04/13 面试题
电气自动化自荐信
2013/10/10 职场文书
应届生的求职推荐信范文
2013/11/30 职场文书
百日安全活动总结
2014/05/04 职场文书
绘画专业自荐信
2014/07/04 职场文书
2016年4月份红领巾广播稿
2015/12/21 职场文书
亲情作文之母爱
2019/09/25 职场文书