To view this demo on a destop or laptop computer, use a modern browser such as Firefox, Google Chrome or Apple’s Safari.
Decrease the browser window width by dragging the right hand edge or grab handle to the left of your screen.
Each section can have any type of content.
The image shown here has a width set to three quarters of the section width and will expand and contract to adjust to varying device widths.
This section can be open on page load or closed if required.
This is closed on page load by default and is clicked in the header to open.
Lists can be displayed in columns as shown in Block A below.
Block B illustrates wrapping text in a second column.
Text inside this column will wrap and roll down the page
Up to five columns can be used but two is a reasonable maximum for easy viewing on the limited screen width of a smart phone.
This final section can be used for content that would normally be in the footer such as © notice, contact info etc. thus saving space and keeping the page height down to a minimum.
JQuery Mobile Website Design
© ezmacwebdesign.com - 2011