0

I have two floated divs: a #center div and a #sidebar div. Center div has got updatable text in it and so its height is set to "auto". The sidebar div also has height auto but, right underneath a scrolling div with definite height, it continues till reaching the bottom of the first div. I want to fill this different space by loading a proper class (each with different backgrounds and different heights). So far I managed to create a js script that retrieves center div height and displays a msg according to its value.

<div id="center">
    <p>Some long text</p>
</div>
<div id="sidebar">
    <div class="scroller"></div>


<script type="text/javascript">

    var gd;
    function getDivHeight(divID){ 
        gd = document.getElementById('center').offsetHeight;
        if(gd <=400) alert("no space");
        else if(gd >400 <=500) alert("short space");
        else if(gd >500 <=600) alert("mid space");
        else if(gd >600 <=700) alert("large space");
        else if(gd >700) alert("too much space");
    }

    getDivHeight('center'); 

</script>

What I don't know is how can I use that gd value to load a certain class or div. Can it be done all in JS or do I need some php.... I'm a newbee in both of them and can't really find my way around without some help. Any suggestion or hint that could put me on the right track will be highly appreciated

thx

Alberto

4

1 回答 1

0

我猜它不能这样做，因为 PHP 在 JS 执行任何类型的计算之前解析页面。做这种事情的唯一方法可能是通过 Ajax 并返回到 php，这对我来说听起来非常复杂 ^__^

阿尔贝托

于 2012-07-23T20:05:40.663 回答