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

 更新时间:2010年06月25日 20:01:58   作者:  
让 IE6 及其以下版本支持 CSS 中 min/max-width/height 属性
说明:让 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]-->

相关文章

  • layui实现下拉复选功能的例子(包括数据的回显与上传)

    layui实现下拉复选功能的例子(包括数据的回显与上传)

    今天小编大家分享一篇layui实现下拉复选功能的例子(包括数据的回显与上传),具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-09-09
  • 微信小程序如何设置基本的页面样式,做出用户界面UI

    微信小程序如何设置基本的页面样式,做出用户界面UI

    这篇文章主要介绍了微信小程序如何设置基本的页面样式,做出用户界面UI。如何为这个页面添加样式,使它看上去更美观,教大家写出实际可以使用的页面。
    2022-12-12
  • C#中TrimStart,TrimEnd,Trim在javascript上的实现

    C#中TrimStart,TrimEnd,Trim在javascript上的实现

    今天在后台写了个类,后来才发现,需要在JS上做..于是把代码拷到js上进行修改,代码中用到TrimStart,TrimEnd,Trim等方法,在网上找半天竟然没找到.要么就只能清除空格的!
    2011-01-01
  • 详解webpack异步加载业务模块

    详解webpack异步加载业务模块

    本篇文章主要介绍了webpack异步加载业务模块 ,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-06-06
  • javascript Canvas动态粒子连线

    javascript Canvas动态粒子连线

    这篇文章主要为大家详细介绍了javascript Canvas动态粒子连线,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-01-01
  • 改版了网上的一个js操作userdata

    改版了网上的一个js操作userdata

    改版了网上的一个js操作userdata,并根据其它网友的文章结合了下。希望对需要的朋友有所帮助。
    2007-04-04
  • JS函数内部属性之arguments和this实例解析

    JS函数内部属性之arguments和this实例解析

    在函数内部,有两个特殊的对象:arguments和this。这篇文章主要介绍了函数内部属性之arguments和this ,需要的朋友可以参考下
    2018-10-10
  • WebSocket中心跳检测与断开重连机制详解

    WebSocket中心跳检测与断开重连机制详解

    心跳检测是指在WebSocket连接过程中定时向服务端发送和接收心跳消息,来确定当前连接是否是正常状态的检测机制,断开重连是指在WebSocket不正常断开连接后,进行重新连接的策略,下面我们就来看看这二者的具体实现吧
    2024-01-01
  • js实现倒计时关键代码

    js实现倒计时关键代码

    这篇文章主要为大家详细介绍了js实现倒计时的关键代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-05-05
  • Egg.js构建一个stream流式接口服务实现详解

    Egg.js构建一个stream流式接口服务实现详解

    这篇文章主要为大家介绍了Egg.js构建一个stream流式接口服务实现详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-09-09

最新评论