让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 相关文章推荐
prototype Element学习笔记(篇二)
Oct 26 Javascript
纯js分页代码(简洁实用)
Nov 05 Javascript
js读取被点击次数的简单实例(从数据库中读取)
Mar 07 Javascript
谈一谈javascript闭包
Jan 28 Javascript
详解JavaScript中this关键字的用法
May 26 Javascript
Jquery对新插入的节点 绑定Click事件失效的解决方法
Jun 02 Javascript
checkbox批量选中,获取选中项的值的简单实例
Jun 28 Javascript
最常见和最有用的字符串相关的方法详解
Feb 06 Javascript
原生JS仿QQ阅读点击展开、收起效果
Mar 08 Javascript
js实现移动端导航点击自动滑动效果
Jul 18 Javascript
vue 自定义组件 v-model双向绑定、 父子组件同步通信的多种写法
Nov 27 Javascript
微信小程序授权登录及解密unionId出错的方法
Sep 26 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
浅析PHP Socket技术
2013/08/02 PHP
php编程中echo用逗号和用点号连接的区别
2016/03/26 PHP
PHP如何将图片文件上传到另外一台服务器上
2019/08/26 PHP
PHP连接MySQL数据库的三种方式实例分析【mysql、mysqli、pdo】
2019/11/04 PHP
PHP7 foreach() 函数修改
2021/03/09 PHP
javascript+mapbar实现地图定位
2010/04/09 Javascript
加载jQuery后$冲突的解决办法
2010/07/09 Javascript
JQuery循环滚动图片代码
2011/12/08 Javascript
easyui window refresh 刷新两次的解决方法(推荐)
2016/05/18 Javascript
JS实现区分中英文并统计字符个数的方法示例
2018/06/09 Javascript
使用nvm和nrm优化node.js工作流的方法
2019/01/17 Javascript
详解一个基于react+webpack的多页面应用配置
2019/01/21 Javascript
微信小程序位置授权处理方法
2019/06/13 Javascript
小程序最新获取用户昵称和头像的方法总结
2019/09/23 Javascript
nuxt.js添加环境变量,区分项目打包环境操作
2020/11/06 Javascript
Python标准库之itertools库的使用方法
2017/09/07 Python
Python多进程并发与多线程并发编程实例总结
2018/02/08 Python
python实现控制电脑鼠标和键盘,登录QQ的方法示例
2019/07/06 Python
Series和DataFrame使用简单入门
2019/11/13 Python
Python调用Windows命令打印文件
2020/02/07 Python
Python-for循环的内部机制
2020/06/12 Python
Styleonme中文网:韩国高档人气品牌
2017/06/21 全球购物
在子网210.27.48.21/30种有多少个可用地址?分别是什么?
2014/07/27 面试题
人民调解员培训方案
2014/06/05 职场文书
城市创卫标语
2014/06/17 职场文书
大学生心理活动总结
2014/07/04 职场文书
2015年银行员工工作总结
2015/04/24 职场文书
大学生违纪检讨书范文
2015/05/07 职场文书
2015年教师见习期工作总结
2015/05/20 职场文书
投诉书范文
2015/07/02 职场文书
团结友爱主题班会
2015/08/13 职场文书
python实现进度条的多种实现
2021/04/29 Python
用Python生成会跳舞的美女
2022/01/18 Python
解决xampp安装后Apache无法启动
2022/03/21 Servers
 Redis 串行生成顺序编码的方法实现
2022/04/03 Redis
java实现面板之间切换功能
2022/06/10 Java/Android