javascript - jquery code to check page height not seem working correctly -


i have lil piece of jqery code here:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript"> hasvbar=""; hashbar=""; $(document).ready(function() {     // check if body height higher window height :)     if ($(document).height() > $(window).height()) {        // alert("vertical scrollbar! d:");     hasvbar="y";     }      // check if body width higher window width :)     if ($(document).width() > $(window).width()) {         //alert("horizontal scrollbar! d:<");   hashbar="n";     } }); </script> 

now in html page first div 200px in height, below div contains 3 paras each in different div. show hide these 3 paras javascript onclick. problem if these 3 divs in hidden state (display:none , visibility:hidden) vertical scroll bar shows up. expecting vertical scrollbar pop if combination of 3 divs sufficient enough make height of document higher window height. atleast when page opened (all 3 divs in hidden state then).

i hope have been able make query clear. suggestions ??? thanks.. in advance...

window.onload=function starterjobs(){ document.getelementbyid('abtpri').style.visibility='hidden';     document.getelementbyid('abtpri').style.display='none'; }   <script type="text/javascript"> function hidepara(whichid) { showhide = document.getelementbyid(whichid).style.display; if (showhide=='block') { document.getelementbyid(whichid).style.display='none'; document.getelementbyid(whichid).style.visibility='hidden'; } else { document.getelementbyid(whichid).style.display='block'; document.getelementbyid(whichid).style.visibility='visible'; } } </script>   <div style=" position:relative;background:none; width:auto; height:25px; padding:10px 0px 10px 0px;"> <div style="position:relative; top:0px; left:0px; background:transparent url(lftarw.gif) no-repeat; width:25px; height:25px; cursor:pointer" onclick="hidepara('abtpri'); "></div> <div id="printing1" class="h1type4" style="position:relative; top:-25px; left:25px; background-color:none; width:auto; height:20px; padding-top:5px; margin-right:25px;">printing</div> </div>     <div id="abtpri" style="padding-left:25px;">     ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum      </div> 

that because define height each of divs. though not visible, still should take space.

with no height, div should expand fit content when visible , disappear when hidden.


Comments

Popular posts from this blog

c++ - Convert big endian to little endian when reading from a binary file -

C#: Application without a window or taskbar item (background app) that can still use Console.WriteLine() -

unicode - Are email addresses allowed to contain non-alphanumeric characters? -