I have a pagination that needs to look like that:
a busy cat http://img338.imageshack.us/img338/3180/pagination.jpg
Basically, it's a div ( 20 000 px wide) inside another div that have a width of 160 with an overflow:hidden.
I used iScroll to make it scroll (im currently doing the iPad version of my site, so it have to works only on iPad) . So far it's working great, I can scroll in my div, and I need to "click" on the number to go to the page. And then the page reload.
My problem is that when my page load, the current page (the one in pink with a class="current") need to be in the middle of my div (like on the picture). So I need a way in javascript to do that...
For exemple, if I click on page 20, when the page loads, the pagination show the page from 1 to 10, if I scroll I can see that the page 20 is set as "current". Need a way to calculate the position and center it.
I have totally no idea on how to do that with javascript / jquery ...!
Can someone help?
iScroll has a public method for this: scrollToElement – see the docs.
As an aside, the browser in iOS 5 supports scrolling natively with overflow:auto; and a special CSS declaration, -webkit-overflow-scrolling:touch;. I would use the native scrolling support instead of iScroll.
