Test if the scroll bar is at the bottom

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • bgold12

    Test if the scroll bar is at the bottom

    How can I test if a vertical scroll bar is at the bottom of the range?
    I know that...

    document.getEle mentById('mydiv ').scrollHeight

    ....returns the range, and...

    document.getEle mentById('mydiv ').scrollTop

    ....returns the position of the top of the scroll handle in the range,
    but that's not enough information because the scroll handle adds an
    arbitrary amount of height. Is there a way to test for the height of
    the scroll handle, or is there just a better way to test if the scroll
    bar is at the bottom of the range?

    Thanks.
  • David Mark

    #2
    Re: Test if the scroll bar is at the bottom

    On Aug 7, 12:12 am, bgold12 <bgol...@gmail. comwrote:
    How can I test if a vertical scroll bar is at the bottom of the range?
    I know that...
    >
    document.getEle mentById('mydiv ').scrollHeight
    >
    ...returns the range, and...
    >
    document.getEle mentById('mydiv ').scrollTop
    >
    ...returns the position of the top of the scroll handle in the range,
    but that's not enough information because the scroll handle adds an
    arbitrary amount of height. Is there a way to test for the height of
    You need the clientHeight property to complete the equation, but it
    has nothing to do with the scrollbar dimensions.

    Comment

    • bseanvt

      #3
      Re: Test if the scroll bar is at the bottom

      On Aug 7, 12:12 am, bgold12 <bgol...@gmail. comwrote:
      How can I test if a vertical scroll bar is at the bottom of the range?
      I know that...
      >
      document.getEle mentById('mydiv ').scrollHeight
      >
      ...returns the range, and...
      >
      document.getEle mentById('mydiv ').scrollTop
      >
      ...returns the position of the top of the scroll handle in the range,
      but that's not enough information because the scroll handle adds an
      arbitrary amount of height. Is there a way to test for the height of
      the scroll handle, or is there just a better way to test if the scroll
      bar is at the bottom of the range?
      >
      Thanks.
      var myDiv = document.getEle mentById("myEle ment"); //get the html
      element
      height = myDiv.scrollHei ght; //total height of
      div element
      position = myDiv.scrollTop ; //where the
      scrollbar is positioned if overflowing...
      scrollbar = myDiv.clientHei ght; //the actual
      height of scrollbar widget (the blue thingamajiggy)

      //to check if the scrollbar is docked at the bottom
      //do something like this...
      if((height - position) == scrollbar){
      alert('scrollba r is docked at the bottom');
      }

      -bseanvt

      Comment

      • bseanvt

        #4
        Re: Test if the scroll bar is at the bottom

        On Aug 13, 4:10 pm, bseanvt <bsea...@gmail. comwrote:
        On Aug 7, 12:12 am, bgold12 <bgol...@gmail. comwrote:
        >
        >
        >
        How can I test if a vertical scroll bar is at the bottom of the range?
        I know that...
        >
        document.getEle mentById('mydiv ').scrollHeight
        >
        ...returns the range, and...
        >
        document.getEle mentById('mydiv ').scrollTop
        >
        ...returns the position of the top of the scroll handle in the range,
        but that's not enough information because the scroll handle adds an
        arbitrary amount of height. Is there a way to test for the height of
        the scroll handle, or is there just a better way to test if the scroll
        bar is at the bottom of the range?
        >
        Thanks.
        >
        var myDiv   = document.getEle mentById("myEle ment");  //get the html
        element
        height      = myDiv.scrollHei ght;                   //total height of
        div element
        position    = myDiv.scrollTop ;                       //where the
        scrollbar is positioned if overflowing...
        scrollbar   = myDiv.clientHei ght;                   //the actual
        height of scrollbar widget (the blue thingamajiggy)
        >
        //to check if the scrollbar is docked at the bottom
        //do something like this...
        if((height - position) == scrollbar){
          alert('scrollba r is docked at the bottom');
        >
        }
        >
        -bseanvt
        oops... made a mistake... need to add those vars together. here is the
        code:

        var container = document.getEle mentById("my_co ntainer");
        height = container.clien tHeight;
        scroll = container.scrol lHeight;
        positon = container.scrol lTop;

        if((height + position) == scroll){
        /* do something here like reposition scrollbar */
        container.scrol lTop = 123;
        }

        Comment

        Working...