解决ie6不支持min/max-width/height属性办法

 

 代码如下 复制代码

// 说明:让 IE6 及其以下版本支持 CSS 中 min/max-width/height 属性
// 整理:http://www.111cn.net
// minmax.js: make IE5+/Win support CSS min/max-width/height
// version 1.0, 08-Aug-2003
// written by Andrew Clover <and@doxdesk.com>, use freely
 
/*@cc_on
@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 属性,因此,我们可以用下面的调用方式:

 代码如下 复制代码

<!--[if lt IE 7]>
<script type="text/javascript" src="minmax.js"></script>
<![endif]-->

时间: 2024-08-02 09:00:39

解决ie6不支持min/max-width/height属性办法的相关文章

利用JS解决ie6不支持max-width,max-height问题

 本篇文章主要介绍了利用JS解决ie6不支持max-width,max-height问题的方法.需要的朋友可以过来参考下,希望对大家有所帮助 今天遇到一个关于用js解决ie6不支持支持max-width,max-height的问题,刚开始用jQuery方法来实现,不过一直获取不到css里面的值,如   代码如下:   if($.browser.msie && $.browser.version == 6.0)   {     var maxWidth = parseInt($('.view

利用JS解决ie6不支持max-width,max-height问题的方法_javascript技巧

今天遇到一个关于用js解决ie6不支持支持max-width,max-height的问题,刚开始用jQuery方法来实现,不过一直获取不到css里面的值,如 复制代码 代码如下:   if($.browser.msie && $.browser.version == 6.0)  {    var maxWidth = parseInt($('.viewBigPic img').css('max-width'));    $('.viewBigPic img').each(function(

网页设计小技巧:解决IE6不支持hover

文章简介:网页设计小技巧:解决IE6不支持hover.  IE6以及更低版本的浏览器对":hover"的支持不理想,对于类似的"p:hover"."img:hover"."#header:hover"...,今天给大家介绍一种新的方法,可以完美解决IE6不支持hover的情况,用法很简单,将下载后的"csshover.htc"文件,定义在body样式内 body { behavior:url("c

CSS实例教程:完美解决IE6不支持hover的方法

文章简介:完美解决IE6不支持hover的方法. <style type="text/css">         p:hover,p.hover { background:#eee; }   /* 就是要多写一个.hover而已 */ </style> 下面这段代码要放到页面的底部在</body> 前: <script type="text/javascript">    //<!–  让所有标记支持hover 

织梦如何去除img中的style width height属性

在dede/article_add.php中搜索如下代码: $body = AnalyseHtmlBody($body,$description,$litpic,$keywords,'htmltext'); 在这句代码的下面插入如下代码: //去除img中的style属性  $body = preg_replace("/style=\\\.+?['|\"]/i",'',$body);  //去除img中的width,height属性  $exp=Array("/he

解决IE6不支持Css FIXED实现详解

例1. 下面这个方法可以完美的实现ie6里支持fixed   代码:    代码如下 复制代码 <!DOCTYPE html>  <html>  <head>  <style type="text/css">  *{padding:0;margin:0;}   html,body{ _height:100%; _overflow:hidden;}   body{ _overflow:auto;}   #header,#footer{  

js完美解决IE6不支持position:fixed的bug

  关于IE6,虽然它已被微软抛弃很久了,但是由于大天朝的特殊行情(盗版)对于前端工程师来说,解决IE6兼容position:fixed的问题显得很重要.特别是你需要用到头尾悬停调用的时候 先来看段代码 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Typ

解决IE6不支持position:fixed的bug

外需要注意的一点就是,导航的宽度必须是固定值,不能是auto或者100%因为fixed和absolute都不认识,当然你也可以手动获取到导航的宽度,然后写到浮动导航样式里,不过有个前提,导航原先样式里不能有:position:relative,情况可能比较多,最简单的方法还是把导航宽度定死    代码如下 复制代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" con

JQuery解决IE6不支持透明png图片、png背景

1,解决直接以 img 标签显示的png图片    代码如下 复制代码 $(document.body).fixpng({scope:'img'}); 可将body内的所有png图片显示为透明效果. 2,解决以 透明png为背景 图片的情况  代码如下 复制代码 $('div').fixpng(); 可将所有 div 标签 背景图为png的变为透明 演示  代码如下 复制代码 <script type="text/javascript" src="jquery-late