让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 相关文章推荐
浅谈javascript 面向对象编程
Oct 28 Javascript
boxy基于jquery的弹出层对话框插件扩展应用 弹出层选择器
Nov 21 Javascript
用RadioButten或CheckBox实现div的显示与隐藏
Sep 21 Javascript
window.location.href的用法(动态输出跳转)
Aug 09 Javascript
Json实现异步请求提交评论无需跳转其他页面
Oct 11 Javascript
javascript函数式编程程序员的工具集
Oct 11 Javascript
JavaScript常用函数工具集:lao-utils
Mar 01 Javascript
jQuery插件实现文件上传功能(支持拖拽)
Aug 27 Javascript
Bootstrap CSS组件之下拉菜单(dropdown)
Dec 17 Javascript
为vue项目自动设置请求状态的配置方法
Jun 09 Javascript
OpenLayers3实现图层控件功能
Sep 25 Javascript
如何在 Vue 表单中处理图片
Jan 26 Vue.js
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取得字符串首字母的方法
2015/03/25 PHP
PHP代码维护,重构变困难的4种原因分析
2016/01/25 PHP
PHP随机获取未被微信屏蔽的域名(微信域名检测)
2017/03/19 PHP
PHP基于堆栈实现的高级计算器功能示例
2017/09/15 PHP
利用jQuery插件扩展识别浏览器内核与外壳的类型和版本的实现代码
2011/10/22 Javascript
easyui datagrid 键盘上下控制选中行示例
2014/03/31 Javascript
JavaScript实现生成GUID(全局统一标识符)
2014/09/05 Javascript
jQuery实现的输入框选择时间插件用法实例
2015/02/28 Javascript
AngularJS ng-controller 指令简单实例
2016/08/01 Javascript
深入浅析search 搜索框的写法
2016/08/02 Javascript
如何学JavaScript?前辈的经验之谈
2016/12/28 Javascript
JavaScript中三种常见的排序方法
2017/02/24 Javascript
微信小程序 商城开发(ecshop )简单实例
2017/04/07 Javascript
稍微学一下Vue的数据响应式(Vue2及Vue3区别)
2019/11/21 Javascript
Python中实现对Timestamp和Datetime及UTC时间之间的转换
2015/04/08 Python
探索Python3.4中新引入的asyncio模块
2015/04/08 Python
Python 数据结构之堆栈实例代码
2017/01/22 Python
python2.7 mayavi 安装图文教程(推荐)
2017/06/22 Python
python机器学习之贝叶斯分类
2018/03/26 Python
详解Python3.6安装psutil模块和功能简介
2018/05/30 Python
windows下搭建python scrapy爬虫框架步骤
2018/12/23 Python
Python使用dict.fromkeys()快速生成一个字典示例
2019/04/24 Python
简单了解python关系(比较)运算符
2019/07/08 Python
详解centos7+django+python3+mysql+阿里云部署项目全流程
2019/11/15 Python
用python3读取python2的pickle数据方式
2019/12/25 Python
TensorFlow tf.nn.conv2d实现卷积的方式
2020/01/03 Python
Python中断多重循环的几种方式详解
2020/02/10 Python
基于Pytorch SSD模型分析
2020/02/18 Python
基于Python爬取搜狐证券股票过程解析
2020/11/18 Python
HTML5 video标签(播放器)学习笔记(二):播放控制
2015/04/24 HTML / CSS
澳大利亚购买太阳镜和眼镜网站:Glamoureyes
2020/09/22 全球购物
优秀英语专业毕业生求职信
2013/11/23 职场文书
《画家乡》教学反思
2014/04/22 职场文书
2015年社区民政工作总结
2015/04/21 职场文书
汉语拼音教学反思
2016/02/22 职场文书
如何使用Python提取Chrome浏览器保存的密码
2021/06/09 Python