设计之家 > 教程 > 網頁教程 > 其他教程 >

IE中顯示min-width效果的解決方案

作者:未知 來源:本站原創 時間:2005-05-10
    在用css布局中,時常用到min-width這個參數,而IE對此無法識別,那么,如何使IE也能顯示同樣的效果呢?這幾天,菜鳥老烏鴉正碰到了這個麻煩事兒,于是google了一大堆資料,找到了個感覺比較簡單的方法,總結一下寫在這里,與鳥們分享。如有錯誤、疏漏之處,還請不吝賜教。
分兩種情況來講。

一、非常方便的解決方法。
我們要讓一個元素在窗口最大化時寬度為100%,當縮小窗口時,要求頁面最小寬度為760px,在css中,一般我們會這樣寫:
CODE#content {
width:100%;
min-width: 760px;
}

非常好,在opera、firefox下顯示很正常。但在IE下沒有效果。解決方法只要在后面加一句就行了,如下:
CODE#content {
width:100%;
min-width: 760px;
width: expression(document.body.clientWidth < 760? "760px": "100%" );
}


二、應用于body
上面的解決方法并不能應用于body元素,當我們需要對body也進行此設置時,用js來解決是比較好的。為了可愛的firofox、opera等,css里這一句還是要寫上的:
CODEbody {
margin: 0;
padding: 0;
width:100%
min-width: 760px;
}


然后在頁面中再調用一個js,代碼如下:
CODEvar d = document;
var winIE = (navigator.userAgent.indexOf("Opera")==-1 && (d.getElementById && &nbsp;d.documentElement.behaviorUrns)) &nbsp;? true : false;
function bodySize(){
if(winIE && d.documentElement.clientWidth) {
&nbsp;sObj = d.getElementsByTagName("body")[0].style;
&nbsp;sObj.width = (d.documentElement.clientWidth<760) ? "760px" : "100%";
}
}
function init(){
if(winIE) { bodySize(); }
}
onload = init;
if(winIE) { onresize = bodySize; }
标签:

相關文章:

推薦設計

最新文章