让IE6支持min-width和max-width的方法


Posted in Javascript onJune 25, 2010

说明:让 IE6 及其以下版本支持 CSS 中 min/max-width/height 属性

@if (@_win32 && @_jscript_version>4) 
var minmax_elements; 
minmax_props= new Array( 
new Array('min-width', 'minWidth'), 
new Array('max-width', 'maxWidth'), 
new Array('min-height','minHeight'), 
new Array('max-height','maxHeight') 
); 
// Binding. Called on all new elements. If <body>, initialise; check all 
// elements for minmax properties 
function minmax_bind(el) { 
var i, em, ms; 
var st= el.style, cs= el.currentStyle; 
if (minmax_elements==window.undefined) { 
// initialise when body element has turned up, but only on IE 
if (!document.body || !document.body.currentStyle) return; 
minmax_elements= new Array(); 
window.attachEvent('onresize', minmax_delayout); 
// make font size listener 
em= document.createElement('div'); 
em.setAttribute('id', 'minmax_em'); 
em.style.position= 'absolute'; em.style.visibility= 'hidden'; 
em.style.fontSize= 'xx-large'; em.style.height= '5em'; 
em.style.top='-5em'; em.style.left= '0'; 
if (em.style.setExpression) { 
em.style.setExpression('width', 'minmax_checkFont()'); 
document.body.insertBefore(em, document.body.firstChild); 
} 
} 
// transform hyphenated properties the browser has not caught to camelCase 
for (i= minmax_props.length; i-->0;) 
if (cs[minmax_props[i][0]]) 
st[minmax_props[i][1]]= cs[minmax_props[i][0]]; 
// add element with properties to list, store optimal size values 
for (i= minmax_props.length; i-->0;) { 
ms= cs[minmax_props[i][1]]; 
if (ms && ms!='auto' && ms!='none' && ms!='0' && ms!='') { 
st.minmaxWidth= cs.width; st.minmaxHeight= cs.height; 
minmax_elements[minmax_elements.length]= el; 
// will need a layout later 
minmax_delayout(); 
break; 
} } 
} 
// check for font size changes 
var minmax_fontsize= 0; 
function minmax_checkFont() { 
var fs= document.getElementById('minmax_em').offsetHeight; 
if (minmax_fontsize!=fs && minmax_fontsize!=0) 
minmax_delayout(); 
minmax_fontsize= fs; 
return '5em'; 
} 
// Layout. Called after window and font size-change. Go through elements we 
// picked out earlier and set their size to the minimum, maximum and optimum, 
// choosing whichever is appropriate 
// Request re-layout at next available moment 
var minmax_delaying= false; 
function minmax_delayout() { 
if (minmax_delaying) return; 
minmax_delaying= true; 
window.setTimeout(minmax_layout, 0); 
} 
function minmax_stopdelaying() { 
minmax_delaying= false; 
} 
function minmax_layout() { 
window.setTimeout(minmax_stopdelaying, 100); 
var i, el, st, cs, optimal, inrange; 
for (i= minmax_elements.length; i-->0;) { 
el= minmax_elements[i]; st= el.style; cs= el.currentStyle; 
// horizontal size bounding 
st.width= st.minmaxWidth; optimal= el.offsetWidth; 
inrange= true; 
if (inrange && cs.minWidth && cs.minWidth!='0' && cs.minWidth!='auto' && cs.minWidth!='') { 
st.width= cs.minWidth; 
inrange= (el.offsetWidth<optimal); 
} 
if (inrange && cs.maxWidth && cs.maxWidth!='none' && cs.maxWidth!='auto' && cs.maxWidth!='') { 
st.width= cs.maxWidth; 
inrange= (el.offsetWidth>optimal); 
} 
if (inrange) st.width= st.minmaxWidth; 
// vertical size bounding 
st.height= st.minmaxHeight; optimal= el.offsetHeight; 
inrange= true; 
if (inrange && cs.minHeight && cs.minHeight!='0' && cs.minHeight!='auto' && cs.minHeight!='') { 
st.height= cs.minHeight; 
inrange= (el.offsetHeight<optimal); 
} 
if (inrange && cs.maxHeight && cs.maxHeight!='none' && cs.maxHeight!='auto' && cs.maxHeight!='') { 
st.height= cs.maxHeight; 
inrange= (el.offsetHeight>optimal); 
} 
if (inrange) st.height= st.minmaxHeight; 
} 
} 
// Scanning. Check document every so often until it has finished loading. Do 
// nothing until <body> arrives, then call main init. Pass any new elements 
// found on each scan to be bound 
var minmax_SCANDELAY= 500; 
function minmax_scan() { 
var el; 
for (var i= 0; i<document.all.length; i++) { 
el= document.all[i]; 
if (!el.minmax_bound) { 
el.minmax_bound= true; 
minmax_bind(el); 
} } 
} 
var minmax_scanner; 
function minmax_stop() { 
window.clearInterval(minmax_scanner); 
minmax_scan(); 
} 
minmax_scan(); 
minmax_scanner= window.setInterval(minmax_scan, minmax_SCANDELAY); 
window.attachEvent('onload', minmax_stop); 
@end @*/

由于只有 IE6 及其以下版本不支持min/max-width/height 属性,因此,我们可以用下面的调用方式:
Code:
<!--[if lt IE 7]> 
<script type="text/javascript" src="minmax.js"></script> 
<![endif]-->
Javascript 相关文章推荐
Jquery增加鼠标中间功能mousewheel的实例代码
Sep 05 Javascript
jquery实现按Enter键触发事件示例
Sep 10 Javascript
Java/JS获取flash高宽的具体方法
Dec 27 Javascript
JS高级调试技巧:捕获和分析 JavaScript Error详解
Mar 16 Javascript
jQuery函数的第二个参数获取指定上下文中的DOM元素
May 19 Javascript
JQuery操作元素的css样式
Mar 09 Javascript
JavaScript中误用/g导致的正则test()无法正确重复执行的解决方案
Jul 27 Javascript
JS常用正则表达式总结【经典】
May 12 Javascript
原生JS实现ajax与ajax的跨域请求实例
Dec 01 Javascript
JavaScript实现页面中录音功能的方法
Jun 04 Javascript
在vue中使用axios实现post方式获取二进制流下载文件(实例代码)
Dec 16 Javascript
vue-router为激活的路由设置样式操作
Jul 18 Javascript
jQuery与其它库冲突的解决方法
Jun 25 #Javascript
jQuery.Validate 使用笔记(jQuery Validation范例 )
Jun 25 #Javascript
基于jquery的checkbox下拉框插件代码
Jun 25 #Javascript
jquery keypress,keyup,onpropertychange键盘事件
Jun 25 #Javascript
javascript中字符串替换函数replace()方法与c# 、vb 替换有一点不同
Jun 25 #Javascript
javascript面向对象编程(一) 实例代码
Jun 25 #Javascript
asp.net+jquery滚动滚动条加载数据的下拉控件
Jun 25 #Javascript
You might like
虫族 Zerg 历史背景
2020/03/14 星际争霸
joomla内置的表单验证功能使用方法
2010/06/11 PHP
深入解析php之sphinx
2013/05/15 PHP
php使用正则表达式获取字符串中的URL
2016/12/29 PHP
PHP实现批量重命名某个文件夹下所有文件的方法
2017/09/04 PHP
PHP7如何开启Opcode打造强悍性能详解
2018/05/11 PHP
PHP进阶学习之Geo的地图定位算法详解
2019/06/19 PHP
菜鸟javascript基础整理1
2010/12/06 Javascript
showModelDialog弹出文件下载窗口的使用示例
2013/11/19 Javascript
jquery遍历之parent()和parents()的区别及parentsUntil()方法详解
2013/12/02 Javascript
解决jquery版本冲突的有效方法
2014/09/02 Javascript
使用jQuery和Bootstrap实现多层、自适应模态窗口
2014/12/22 Javascript
Window.Open打开窗体和if嵌套代码
2016/04/15 Javascript
jQuery动态生成表格及右键菜单功能示例
2017/01/13 Javascript
jQuery实现给input绑定回车事件的方法
2017/02/09 Javascript
使用vue和datatables进行表格的服务器端分页实例代码
2017/06/07 Javascript
在vue项目中集成graphql(vue-ApolloClient)
2018/09/08 Javascript
微信小程序实现星级评价
2019/11/20 Javascript
python 采集中文乱码问题的完美解决方法
2016/09/27 Python
python 类详解及简单实例
2017/03/24 Python
Python创建一个空的dataframe,并循环赋值的方法
2018/11/08 Python
详解python做UI界面的方法
2019/02/27 Python
在django中,关于session的通用设置方法
2019/08/06 Python
django ManyToManyField多对多关系的实例详解
2019/08/09 Python
Pycharm中安装Pygal并使用Pygal模拟掷骰子(推荐)
2020/04/08 Python
浅谈Python中的继承
2020/06/19 Python
Django视图、传参和forms验证操作
2020/07/15 Python
python利用tkinter实现图片格式转换的示例
2020/09/28 Python
用css3实现当鼠标移进去时当前亮其他变灰效果
2014/04/08 HTML / CSS
模具设计与制造专业应届生求职信
2013/10/18 职场文书
如何做好总经理助理
2013/11/12 职场文书
清华大学自主招生自荐信
2014/01/29 职场文书
吸烟检讨书2000字
2014/02/13 职场文书
个人委托书范文
2015/01/28 职场文书
2015年三万活动总结
2015/03/25 职场文书
tomcat下部署jenkins的方法
2022/05/06 Servers