Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript problems with scrolling div

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #195030
    bearhead
    Participant

    I’m trying to create a div that has several sections in it. There are two buttons that allow the user to scroll up or down a section with each click.

    I’m trying to adapt a script I found on this codepen:
    http://codepen.io/chromawoods/pen/CKxkg

    Here is my codepen:
    http://codepen.io/anon/pen/VYzOaX

    As you can see, the scrolling on mine is all wonky and I can’t figure out why. Any ideas on how to fix it?

    #195044
    Shikkediel
    Participant

    Gotta be put together a bit differently with a nested element :

    Edited pen

    #195100
    Shikkediel
    Participant

    No problem. Some minor changes – using position will return the offset to the parent (needed with a nested element), offset retrieves the current position of an element relative to the document (quote from the jQuery spec). Instead of scrolling, the top position is simply animated – and an element that should be animated needs some kind of positioning so I added relative to the wrapper. Hiding the overflow was moved to it’s parent .news_box.

    #202226
    cyberbelette
    Participant

    Hello, Like Barehead I’ve been trying unsuccessfully to adapt the same script in a “window” (div+overflow:hidden).
    I tried Shikkediel’s script, and it works! thanks!!
    But one problem remains: if the last section is shorter than the window height, it scrolls up leaving a white space after…
    On your edited pen you can see this problem easily changing the css .news_box height to 400px.
    How could it be possible to stop the scroll before the end, in order to see the last section with no space under? (what means the top of the last section wouldn’t reach the top of the .news_box window)

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.