Pagination for infinite scrolling pages
- Started
- Last post
- 23 Responses
- ctcliff
Working on a UI experiment for an infinite scrolling pagination plugin for jQuery. Check a demo here (Webkit/Mozilla):
http://christophercliff.github.c…
and grab the source here:
https://github.com/christophercl…
Definitely NOT ready for production use, just looking for feedback.
Thanks!
- moIdero0
theres an end somewhere, i will find it.
- ukit0
Doesn't this kind of already exist? Pretty cool though
- ctcliff0
The goal is to contextualize the infinite scrolling experience, rather than let the user scroll into a bottomless pit. Receive instant feedback when pages are added and easily navigate to previously viewed pages.
- moIdero0
kida like fb, but this one has a side nav thats pretty cool
- acescence0
pretty cool, a few suggestions: keep the page numbers on rollover but hilite them rather than having the numbers just disappear (or maybe that's a configurable option), use smoothscroll to scroll between pages rather than jumping, extra points if you hilite each page in the nav as it's scrolling, ooh fancy. maybe a bit of feedback when it's loading new pages, since I imagine it could take some time and it may be confusing as to what is going on, like a cursor following pinwheel thing or whatever.
- I like the highlight the current page thing. Adding to the TODOs.ctcliff
- ernexbcn0
nice!
- ernexbcn0
I might use this in a site I'm working on with a friend, but not as an infinite scroll UI assistance as you devised it but instead to show you which thread in the current page has new replies (it's a message board with constant communication with the clients). The idea is that each thread on the page corresponds to one of your bubbles and when there are new replies on one I might make the bubble blink or change color, and maybe show the amount of new replies in the bubble you are currently using to show the page number.
- DoktorDavid0
I like the effort - and can see the possibilities - for whatever it is worth, around page 77 things start to break down (Chrome) with the page bubbles becoming gapped and kind of odd looking. The migration from sausage links to bubbles is a thing I guess we have to accept - keep working on it, especially with the thoughtful suggestions above.
- dbloc0
i like it. If you find it let us know
- dbloc0
maybe when it starts getting to a lot of pages it groups them into tens. just a thought
- medriocrelite0
It's nice.
Problem with you current interface, when people scroll down using the scrollbar they will hold down the mouse button. In your setup this means that when people reach about 95% of the way down, your scripts starts adding pages repeatedly. Which means I'll go from page 3 to page 8, from 8 to page 13, etc.
- cannonball19780
This breaks the usability of the scroll bar itself, which is defined by limits. I'm not a fan and the feature annoys me, but I can see it's merits.
- raf0
If you make one that you can return to with a back button and it will remember where you were at last, I will applaud.
Every single one I've seen starts from the beginning when you come back to the page.
- slappy0
Really cool, as stated above, if you could have a nice scroll with easing when clicking between pages then I would def use.
- WeLoveNoise0
like it and looks interesting,
keep us posted because would like to see how it ends up
- Daithi0
Lovely idea - maybe the UI could be reduced to appear almost like a ruler? That way it would be less Mac and more generic.
As mentioned above, if the page address changed as the new pages loaded that would be a really useful addition too. Great work.
- Stugoo0
I feel that your contextual page nav is too far from the content, and too close to the scrollbar... That may be deliberate... but if i was browsing this i would keep everything central.
How about a next, previous, and skip to top too?
I know it's only an experiment but i am also not keen on the greys, I would make the tones a bit more in contrast.
maybe include ScrollTo also so that the page rolls up and down using the nav.
overall i love it though. nice idea for interaction!
- ernexbcn0
I'm using it on a page filled with threads + subreplies, the page loads all the threads on load so I'm not interested in the infinite scroll.
I also did a hack for it that changes the color of the bubbles of the items you currently are viewing on your viewport, that's attached to the scroll event of the page so when you scroll you see them changing color.
- I like the way it looks, it's like a DNA sequence or somethingernexbcn
- ctcliff0
Thanks for the feedback everyone!
@DoktorDavid lol, going back in time to rename this project sausages.js
@Stugoo It is deliberate. My thinking is that this is more of a scrollbar enhancer than a navigation. The scrollbar already contains some useful info, i.e. viewable area vs. document height. This is meant to incorporate the relative page height into that context as well.
@medriocrelite Just to clarify, this is meant to be a navigation plugin that will work with ANY lazy load implementation. You're right though, the implementation I hacked together on that demo is a bit rough.