欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

腳本控制自適應(yīng)高度的縮短問題

 更新時(shí)間:2007年10月19日 22:27:45   作者:  
function vvheight() {
       var sideleft=document.getElementById("content-left").scrollHeight;
       var sideright=document.getElementById("content-right").scrollHeight;
       layoutHeight=Math.max(sideleft,sideright);
       document.getElementById("content-left").style.height=layoutHeight+"px";
       document.getElementById("content-right").style.height=layoutHeight+"px";
}

我想用腳本來控制自適應(yīng)高度,我用上面的代碼控制了左列和右列的自適應(yīng)高度。
可是有的頁(yè)面因?yàn)閮?nèi)容多被撐得挺長(zhǎng),有的頁(yè)面內(nèi)容少,用上面的代碼不能縮短了!
我就是想在訪問內(nèi)容少的時(shí)候,內(nèi)容還能再縮回來,代碼應(yīng)該怎么寫呢?謝謝了!
復(fù)制代碼 代碼如下:

function vvheight() {
    var CL=document.getElementById("content-left");
    var CR=document.getElementById("content-right");
    while(parseInt(CL.scrollHeight)==parseInt(CL.style.height)){CL.style.height=parseInt(CL.style.height)-30+"px"}
    var sideleft=CL.scrollHeight;
    while(parseInt(CR.scrollHeight)==parseInt(CR.style.height)){CR.style.height=parseInt(CR.style.height)-30+"px"}
    var sideright=CR.scrollHeight;
    layoutHeight=Math.max(sideleft,sideright);
    CL.style.height=layoutHeight+"px";
    CR.style.height=layoutHeight+"px";
}

解答:
在IE和Opera里,DIV的style.overflowY的默認(rèn)值是"auto",上面的代碼不會(huì)有問題。

在Firefox和Safari里,DIV的style.overflowY的默認(rèn)值是""(相當(dāng)于"hidden"),所以你直接用上面代碼的話,會(huì)出錯(cuò)。需要人為調(diào)整style.overflowY="auto"。

[Ctrl+A 全選 注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]

下面這個(gè)算法略有不同,你看哪一個(gè)效果更好(變化的瞬間人眼睛感覺到的閃爍更?。??

[Ctrl+A 全選 注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]

就是這幾行代碼:

復(fù)制代碼 代碼如下:

    while(CL.scrollHeight==CL.clientHeight){CL.style.height=CL.clientHeight-30+"px"} 
    var sideleft=CL.scrollHeight; 
    while(CR.scrollHeight==CR.clientHeight){CR.style.height=CR.clientHeight-30+"px"}

沒有太多時(shí)間,就先隨便講一講吧。如果感興趣的人多,以后我可以開一些這樣的專題,或者寫到書里去。

元素的scrollHeight屬性是微軟在IE中首創(chuàng)的DHTML屬性,并非W3C規(guī)范或技術(shù)推薦標(biāo)準(zhǔn)的內(nèi)容,但是現(xiàn)在幾乎所有的瀏覽器都在支持這個(gè)屬性(這是因?yàn)閃3C標(biāo)準(zhǔn)中并沒有相應(yīng)的替代方案——因此我通常不提“標(biāo)準(zhǔn)”二字,而總是說“兼容、可用”)。scrollHeight是元素在內(nèi)部不出現(xiàn)縱向滾動(dòng)條的情況下在頁(yè)面上顯示時(shí)將占據(jù)的高度(像素?cái)?shù))。
[attach]64076[/attach]

clientHeight也不是W3C規(guī)范的東西(事實(shí)上,很多有用的東西都與“標(biāo)準(zhǔn)”無(wú)關(guān),但它們是事實(shí)上的標(biāo)準(zhǔn))。clientHeight是元素在頁(yè)面中顯示時(shí)實(shí)際占據(jù)的高度(像素?cái)?shù))。
[attach]64077[/attach]

如果使元素內(nèi)部不出現(xiàn)縱向滾動(dòng)條(給元素足夠多的空間,令其可以完整顯示;或者將其縱向滾動(dòng)條禁用,也就是將style.overflowY設(shè)為"hidden"),則scrollHeight==clientHeight。

在滾動(dòng)條出現(xiàn)時(shí),clientHeight < scrollHeight,元素未能在頁(yè)面上完整顯示,若要令其完整顯示,則至少需要scrollHeight像素高度的空間。

也就是,元素內(nèi)部出現(xiàn)縱向滾動(dòng)條時(shí),scrollHeight就是令元素得以完整顯示的最小高度。

在上面第一個(gè)例子中,我不斷縮短DIV的高度(每次縮短30像素),直到DIV內(nèi)部滾動(dòng)條出現(xiàn),取此時(shí)的scrollHeight值。

在第二個(gè)例子中,我直接把DIV高度設(shè)為1像素,迫使其內(nèi)部出現(xiàn)滾動(dòng)條,取scrollHeight值。

在我的顯示器上,兩個(gè)例子沒有明顯的差別。你可以把顯示器的刷新頻率調(diào)到最低,看看哪一種方式在變化的瞬間閃爍更小,擇優(yōu)用之。

相關(guān)文章

最新評(píng)論