CODEWITHSUNDEEP
javascriptjqueryandroidmobilejquery-mobile
subbudubbu
subbudubbu

Reputation: 93

Replicate Android fast scroll in Javascript

In the web application I am currently developing I am displaying a lot of data on one page, sorted chronologically.

A function similar to "fast scroll" on Android or the equivalent on iOS would be really handy, i.e. a handle on the side of the screen to quickly scroll across the page, maybe displaying the current position next to it.

Nothing like this seems to exist already, so before I start trying to implement it myself, my questions are:

Considering the limitations of Javascript and mobile browsers, is this possible?
If yes, how would i roughly go about doing this?

Upvotes: 3

Views: 765

Answers (2)

Matteo Conta
Matteo Conta

Reputation: 1449

You can create two buttons similar to the arrow of a scrollbar. The button should float an be ever visible. Attach to the mouseover event and misure the time elapsed. Start also to scroll the content or the window, increase the speed in relation to the time spent over the button.

Hope it helps...

Upvotes: 1

Caleb Gray
Caleb Gray

Reputation: 3097

You're correct in thinking that this isn't something that's going to be easily implemented. My two cents:

1) You could attempt to deal with using a combination of CSS and JS to have a "static" div that set's its position based on the $(window).scroll -- but it's been my experience that using scroll() is broken... in some way or another... across browsers... it's just bad.

2) You could also try having a full screen container DIV, with a 'content' child DIV that has its overflow:hidden and margin-top set to "-ScrollAmount"... MaxScrollAmount coming from $('#content').height();

Obviously, I recommend the second approach: completely dodging scroll().

Let me know if I need to expand on this further for it to be a suitable answer.

Upvotes: 1

Related Questions