Blog Index > Mobile Internet > iPad scrollbar missing

iPad scrollbar missing

I've been building websites for iPads and iPhones recently and found that if you have a div layer with overflow:scroll, or overflow:auto, or if you are using iframes, then the iPad does not display a scrollbar. You need to use a two finger swipe to scroll in these elements. There is no CSS hack that can get around this as it is built in to the iPad browser to prevent screen furniture taking up too much space.

Fortunately, there is a script called iScroll which will allow you to display a scrollbar on the div layer/iframe. The current version has some issues with IE9 so I had to add ipad user agent detection to use the regular toolbar if you are not using an ipad.

It works really well and has a lot of cool features - a godsend if you really need to use overflowing div elements of iframes on an ipad website.

However, if you can avoid using inner scrolling, that is the preferred solution, as it is more accessible and iframes are not as good for SEO.