Web Analytics Made Easy - StatCounter Extending Element to Scroll Height - CodingForum

Announcement

Collapse
No announcement yet.

Extending Element to Scroll Height

Collapse
X
Collapse
 
  • Page of 1
  • Filter
  • Time
  • Show
Clear All
new posts
Previous template Next
  • #1

    Extending Element to Scroll Height

    I'm using a basic left navigation 2 table layout. In a small window and when absolutely positioned navigation elements in the left table are taller than the table, the navigation elements extend further than (below) the left table. How can I size the left table to 100% of the scroll height and not the window height?

    I've been playing with this bit of code but haven't made anything work

    if ((document.getElementById('Left_Table').clientHeight)<document.body.scrollHeight)

    Is there a simpler method of doing this that I'm missing?

    Thanks for your help.
    Tags: None
  • #2
    Hi

    could you elaborate a bit more? What do you precisely mean by:
    -----
    100% of the scroll height and not the window height
    -----

    apparently, that is the same thing as I understood it: the window height, in fact, is also the space where you scroll.
    If you want to take into account the level of the page you've scrolled at (and therefore sum, for instance, top+scroll level):

    document.body.scrollTop

    ciao
    Alberto http://www.unitedscripters.com/

    Comment

    • #3
      Hi TrueLies

      I guess I'm on the wrong path. I need the height of the entire HTML document then size the table to the same height.

      Is that what I'll get with document.body.scrollTop?

      Comment

      • #4
        Oh for the height of the whole document you mean; well, yes document.body.scrollHeight gives the height of the whole document.
        But you probably can't get an effective resizing of your table to that. Height property never made much on tables althouhg all manuals cite it. Make a transparent gif of 0.5x0.5 then once you get the height you might rrsize the gif height to the yielded value to stretch the table.

        I don't know what type of problem you've encountered anyway.

        On NN4 and 6 you don't have an equivalent of document.scrollHeight, for it is false that window.innerHeight is equivalent: innerHeight always give the same value: the height of the available window, not the length of the document. Thorny I know!

        PS this is why persuing these groups is useful. See what I just attempted with NN6 to see if I could get the document height: ...
        document.height
        guess what: works!!!
        So the equivalent of scrollheight is, for the document, in NN6 just... height!
        Unbelievable, do you know that many sites do cite window.pageYOffset and/or window.innerHeight (the latter more than the former, but both assumptions prove wrong) like the NN equivalent??
        http://www.siteexperts.com/tips/functions/ts15/page1.asp

        or
        The Dynamic Duo - Using Browser Width/Height
        http://www.dansteinman.com/dynduo/en/widthheight.html


        were urls I searched for to answer you but their codes weren't doing what they said in THIS case at least: no equivalence between document.body.scrollHeight and window.pageYOffset or window.innerHeight, but equivalence inddeed with document.height.
        Now I check on NN4 too... wait...
        WORKS! wow! This is why attending these groups is great isn't it?
        ciao!

        And as the saying goes thax for your question -this time indeed LOL
        Last edited by TrueLies; Jun 30, 2002, 09:31 PM.
        Alberto http://www.unitedscripters.com/

        Comment

        • #5
          <edit>this does not work. See next post</edit>
          Thanks for the info and links TrueLies, it is helpful.

          So would this be the right approach and, if so, how would I size an image to match
          the document.height and document.body.scrollHeight?

          P.S. this appears to work in Mozilla only so far because if you reduce or enlarge the height of the window in IE it will give a different value for the ScrollHeight (as I see it it should be a constant value as in Mozilla)

          <html>
          <head>
          <title>Test</title>
          </head>
          <body>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          content<br>
          <script>
          //if Mozilla
          if (window.innerWidth)
          document.write("Mozilla: document is "+document.height+" and client window is "+window.innerHeight)
          //else IE
          else if (document.all)
          document.write("IE: document is "+document.body.scrollHeight+" and client window is "+document.body.clientHeight);
          </script>
          </body>
          </html>
          Last edited by Graeme Hackston; Jul 1, 2002, 07:34 PM.

          Comment

          • #6
            I found Dave Clarks script in the archived thread below. It works for me with a nested div aligned bottom inside the parent.

            CodingForum
            http://www.codingforum.net/ubb/Forum3/HTML/004308.html


            Thanks for following my "madness" Truelies (lol)

            Comment

            Previous template Next
            Working...
            X