- This topic is empty.
February 3, 2015 at 2:11 pm #195030bearheadParticipant
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:
Here is my codepen:
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?February 4, 2015 at 12:01 am #195044February 4, 2015 at 10:30 am #195100ShikkedielParticipant
No problem. Some minor changes – using
positionwill return the offset to the parent (needed with a nested element),
offsetretrieves 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
relativeto the wrapper. Hiding the overflow was moved to it’s parent
.news_box.May 14, 2015 at 8:06 am #202226cyberbeletteParticipant
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)