关于min-height:100%的解决办法
前几天碰到一个问题,在用bs和jq2.2.0开发时,min-height设为100%在firefox和ie下没有起作用,先用css改了一下,但是min-height虽然是奏效了,但同时出现了其他css问题,千丝万缕,随后万能的js完美解决问题,简单粗暴。
首先说一下问题产生的原因:jq2+获取heigh没有兼容Ie,故height()不行。
查阅资料知:窗口的高度
firefox、chrome、IE9和safari:window.innerHeight
IE系列:document.body.clientHeight
不是IE6:document.documentElement.clientHeight
故兼容代码如下:
var height = window.innerHeight || (document.body ? document.body.clientHeight : false) || (document.documentElement ? document.documentElement.clientHeight : null);
innerHeight获取窗口的文档显示区的高度,但是ie不支持,它用 documentElement.clientHeight 或 document.body.clientHeight 替代。故上面的代码可兼容ie。
不是ie时,取innerHeight,ie时若documentElement.clientHeight为真则取documentElement.clientHeight,若document.body.clientHeight 为真则取document.body.clientHeight 。
至此问题完美解决,赋值给min-height即可。
关于min-height:100%的解决办法的更多相关文章
- 使flex-direction: column的子元素height: 100%生效的办法
在flex-direction: column子元素里直接使用height:100%,height并不会被设置成100% <!DOCTYPE html> <html lang=&qu ...
- ViewPager不能高度自适应?height=wrap_content 无效解决办法
ViewPager用的很多,主要用啦展示广告条.可是高度却不能自适应内容,总是会占满全屏,即使设置android:height="wrap_content"也是没有用的.. 解决办 ...
- IE6 CSS高度height:100% 无效解决方法总结
原文地址:http://www.cnblogs.com/huangyong8585/archive/2013/02/05/2893058.html 上面红色部分为 height:100%; 自动拉 ...
- git卡在Resolving deltas 100%的解决办法
很多同学都有这样的问题.不知道是git的问题,还是tortoisegit的问题. 我的版本: Git-1.8.4-preview20130916 TortoiseGit-1.8.6.0-32bit 已 ...
- chrome调试找不到 XXXX.min.map 原因及解决办法
什么是source map文件. source map文件是js文件压缩后,文件的变量名替换对应.变量所在位置等元信息数据文件,一般这种文件和min.js主文件放在同一个目录下. 比如压缩后原变量是m ...
- RabbitMQ 消费端 Client CPU 100%的解决办法
Func<bool> run = () => { try { using (IConnection conn = cf.CreateConnection()) { using (IM ...
- 引入jquery.js和jquery-1.10.2.min.js 发生冲突解决办法
<html><head></head><body><body><div id = "a">a</div ...
- Win10 磁盘占用 100% 有效解决办法
立即查看 任务管理器,看看是不是有一个 服务主机 unistack服务组或者找类似名称的,点开以后你会看到里面有同步主机 blablah请你毫不犹豫的结束它!结束它!结束它! 按下WIN+R调出运行, ...
- 「Vue」v-html生成的图片大小无法调整的解决办法
问题: v-html生成的图片调整大小属性没用<div class="content" v-html="pdinfo.content"></d ...
随机推荐
- Hibernate基础-HelloWord
1. ORM :ORM (Object /Relation Mapping ): 对象/关系映射(理解) 1) ORM 主要解决对象 -关系的映射 2) .ORM的思想:将关系数据 ...
- web 界面设计---js提交表单
<script type="text/javascript"> function checkImage(){ var imageValue = document.get ...
- iOS开发——高级篇——iOS涂鸦画板效果实现
一个简单的绘图应用,模仿苹果自带软件备忘录里的涂鸦功能 核心代码 #import "DrawView.h" #import "DrawPath.h" @inte ...
- 谈一谈以太坊虚拟机EVM的缺陷与不足
首先,EVM的设计初衷是什么?它为什么被设计成目前我们看的样子呢?根据以太坊官方提供的设计原理说明,EVM的设计目标主要针对以下方面: 简单性(Simplicity) 确定性(Determinism) ...
- mysql数据库ip与字符串
Mysql自带的IP转换语句 inet_aton:将ip地址转换成数字型 inet_ntoa:将数字型转换成ip地址 //使用inet_aton函数,将字符串IP转换为整型: mysql> se ...
- HDU - 2063 过山车(最大匹配数)(模板)
1.男生女生一起坐过山车,每一排有两个座位,但是有个条件,就是每个女生必须找个男生做同伴一起(但是女生只愿意和某几个男生中的一个做同伴),求最多可以有多少对男女生组合坐上过山车. 2.二分图的最大匹配 ...
- KMP算法在字符串中的应用
KMP算法是处理字符串匹配的一种高效算法 它首先用O(m)的时间对模板进行预处理,然后用O(n)的时间完成匹配.从渐进的意义上说,这样时间复杂度已经是最好的了,需要O(m+n)时间.对KMP的学习可以 ...
- P4455 [CQOI2018]社交网络
这个题仔细一看就是生成树计数,但是我这个记性是真的差,早就忘了.复习了一下高斯消元,然后这个题就是很裸的题了. ps:高斯消元解行列式的时候要取反. 题干: 题目背景 当今社会,在社交网络上看朋友的消 ...
- 动画库tween.js
动画库tween.js var Tween = { Linear:function (start,alter,curTime,dur) {return start+curTime/dur*alter; ...
- 09年OA系统集成商资料(转载)
[转载]哪个OA比较好,18家常见OA系统全方位大阅兵 原文地址:http://ec.zdnet.com.cn/managesoft/2009/1104/1503211.shtml 凡是比较或者评测的 ...