JSF app on mobile phone - no scrolling in divs

Question

Hi, I'm writing a simple web application for mobile phones using JSF/Hibernate. I want to display images in a div but since the image size is quite big (400-500 px) I need to add a scroll to that div. It works fine on my PC browser but on mobile the scroll is not visible and only a part of the image is visible. Here is the code:

 <div class=" ui-widget-content ui-corner-all" style="overflow:scroll; position: absolute; width: '+width2+'px; height: '+height2+'px; left: 30px; top: 20px; padding: 10px;"><img src="resources/'+image.plan+'" style="overflow:scroll; padding-top:15px;"/></div>

How to enable the scrolling on mobiles' browsers? Thanks for any suggestions.

Answer 1

Most of the mobile browsers will indeed display scrollable block elements without scrollbars. That's a bit "by design".

This problem is not related to JSF/JSP/HTML. Your code is fine.

See also:

• Scrolling div on iPhone/iPod Touch
• Using jQuery to check if scrollbars are available