SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    monitormensch oerdec's Avatar
    Join Date
    Sep 2004
    Location
    Hamburg
    Posts
    706
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question dynamic height of element

    Hi,

    Please take at look at my example page. On the right site there is a box with a vertical scrollbar.
    Itīs a DIV (id="right") with an iframe in it. Maybe Iīll put a DIV with overflow:auto in it but it doesnīt matter now.

    The customer wants that this 'scrollbox' takes all available vertical space. That means it should start right under the header and end above the footer.
    But when there is much content and the user scrolls down the page the scrollbox has to stick under the top edge of the viewport.

    Does anybody know how to realise this?

    I think I can use JavaScript to get the y-position of the scrollbox and then change margin-top of the iframe or padding-bottom of DIV id="right" or whatever.


    thanks in advance,

    oerdec

    --------------------

    edit:

    I think the code should to work like this.
    Code:
    if ('scrollposition' < 'height of header') {
      'scrollbox padding-top' = 0
      'scrollbox height' = viewport - 'height of header' - 'height of footer'
    }
    else if ('scrollposition' > 'height of the header') {
      'scrollbox padding-top' = scrollposition
      'scrollbox height' = viewport - 'height of footer'
    }
    Now is the question how to make it with JavaScript

  2. #2
    monitormensch oerdec's Avatar
    Join Date
    Sep 2004
    Location
    Hamburg
    Posts
    706
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ok, I know now how to get the scrollposition. I found something on quirksmode.org. But unfortunately it only works without my CSS. Scroll down, there are links to three functions. The document.documentElement.scrollTop works in IE.

    edit: the problem is not the CSS but quirks mode. I forced IE to run in quirksmode because my layout only works this way.


    I think I have a big problem.

  3. #3
    monitormensch oerdec's Avatar
    Join Date
    Sep 2004
    Location
    Hamburg
    Posts
    706
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    After two days of JavaScript war I solved it. More or less. If anybody is interested, hereīs the preview I showed to the customer. The customer is an agency...


    ... but they donīt like it. They want a fixed header now.

  4. #4
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Nelson BC
    Posts
    2,310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Maybe get rid of the scrollbar from the window and put the page content in a scrolly div?

    That way you dont have to worry about moving the thing on the right all the time and you get a fixed header too.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •