<div id="test" style=" border: solid 1px #f00; "></div>
<script type="text/javascript">
<!--
//作者:凌陈亮www.lingchenliang.com(QQ:57404811)
autodivheight();
function autodivheight(){ //函数:获取尺寸
//获取浏览器窗口高度
var winHeight=0;
if (window.innerHeight)
winHeight = window.innerHeight;
else if ((document.body) && (document.body.clientHeight))
winHeight = document.body.clientHeight;
//通过深入Document内部对body进行检测,获取浏览器窗口高度
if (document.documentElement && document.documentElement.clientHeight)
winHeight = document.documentElement.clientHeight;
//DIV高度为浏览器窗口的高度
//document.getElementById("test").style.height= winHeight +"px";
//DIV高度为浏览器窗口高度的一半
document.getElementById("test").style.height= winHeight/2 +"px";
}
window.onresize=autodivheight; //浏览器窗口发生变化时同时变化DIV高度
//-->
</script>

用JS来控制 div的高度随浏览器变化而变化的更多相关文章

  1. js练习-控制div属性

    要开始练练js了,决定先按照Ferris大大的索引表一个个练,头一个就是控制div属性啦.看似挺简单的,不过平时jquery用惯了,用起来原生js还有点手生呢. 总之就是模仿加练习啦,先看看效果: 一 ...

  2. js键盘控制div移动,解决停顿问题

    问题版本代码如下: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 <html> &l ...

  3. yii2封装一个类控制div宽度,高度

    1.首先,封装一个类,放在文件夹vendor下,命名为articls.php. <?phpclass Articles{ //测试    function add()    {        r ...

  4. js键盘控制DIV移动

    <style type="text/css"> html,body{overflow:hidden;}body{margin:0;padding:0;}pre{colo ...

  5. Js控制Div在浏览器中的高度

    //需求是,我需要通过浏览器内容可视化的高度来控制div的高度boxheight(); //执行函数function boxheight(){ //函数:获取尺寸 //获取浏览器窗口高度 var wi ...

  6. 功能整合(一):滚动条的变相隐藏、js控制div的渐变显示、滚动条监听

    1.滚动条的变相隐藏 思路: 1.  把body的横向,纵向的超出部分隐藏,宽设置100%:高设置100%.就没有body的滚动条了, 2.  然后把最外层的div的宽设置的比body的宽宽一点,把d ...

  7. JS控制div跳转到指定的位置的几种解决方案总结

    原文:http://www.jb51.net/article/96574.htm 这篇文章主要介绍了JS控制div跳转到指定的位置的几种解决方案总结,小编觉得挺不错的,现在分享给大家,也给大家做个参考 ...

  8. js 控制Div循环显示 非插件版

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. JS控制DIV隐藏显示

    转载自:http://blog.sina.com.cn/s/blog_6c3a67be0100ldbe.html JS控制DIV隐藏显示 一,需求描述: 现在有3个DIV块,3个超链接,需要点击一个链 ...

随机推荐

  1. XML CDATA节点

    术语CDATA指字符数据.CDATA定义为文本块,但识别为标记. 预定义实体的同位素;,密度,并且与放大器;需要打字并且通常难以阅读的标记.在这种情况下,CDATA部分都可以使用.通过使用CDATA节 ...

  2. JavaScript_Math函数

    JavaScript_Math函数与属性按功能分类 Math三角函数与属性 Math.sin() -- 返回数字的正弦值 Math.cos() -- 返回数字的余弦值 Math.tan() -- 返回 ...

  3. github提交失败并报错java.io.IOException: Authentication failed:

    一.概述 我最近在写一个android的项目. 软件:android studio.Android studio VCS integration(插件) Android studio VCS inte ...

  4. Qt 按钮事件不响应

    在Qt中,我们设置好按钮的相应事件,连好信号槽,声明什么的也没什问题,但为什么点击按钮就是没有反应,检查了半天终于发现原来是子面板上也有一个相同名称的按钮,一般来说两个面板不为父子关系的时候,分别在不 ...

  5. [LintCode] Reverse Nodes in k-Group 每k个一组翻转链表

    Given a linked list, reverse the nodes of a linked list k at a time and return its modified list. If ...

  6. javascript平时小例子⑤(投票效果的练习)

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...

  7. Sql Server按树形结构排序查询表记录

    http://blog.csdn.net/dxnn520/article/details/8089149 ----------------------------------------------- ...

  8. spring中schedule注解的使用

    我们使用spring的注解 @Scheduled 执行定时任务 创建spring-task.xml 文件 <!---加入:xmlns:task="http://www.springfr ...

  9. 关于使用MVVM模式在WPF的DataGrid控件中实现ComboBox编辑列

    最近在做一个组态软件的项目,有一个需求需要在建立IO设备变量的时候选择变量的类型等. 建立IO变量的界面是一个DataGrid实现的,可以一行一行的新建变量,如下如所示: 这里需要使用带有ComboB ...

  10. MySQL数据库初用(5.6版本)第一课

    参考:http://wenku.baidu.com/link?url=NlX55fDDQ02wESO1HNkxpvju2xATwe9Fym0MfojWddXbYaJcjEKKRF9z9EX4b7shV ...