CODEWITHSUNDEEP
jquery-mobilemobilemobile-website
Pavan Kumar
Pavan Kumar

Reputation: 1686

Mobile Web app prototype or demo

I have created html5 screens for Mobile web app. I want to add actions to the pages. I means I tap on any button, the related html page should come like the below example.

http://elsies.appclerk.com/

The flow of the navigation I need to show for demo before development. Is there any way of easy process? Please suggest me.

EDIT: Please check the [jsfiddle](http://jsfiddle.net/4cKhC/">html code).
There, when I tap on the back button the new page or another page should come like the above url (sliders effect).

Upvotes: 1

Views: 278

Answers (1)

peterm
peterm

Reputation: 92785

If you interested only in prototyping you can easily (to a certain degree) achieve this using just jQuery Mobile markup.

You can declare a jQM pages like this:

<div id="contacts" data-role="page">
<div data-role="header">
    <h1>Contacts</h1>
    <a href="#" data-rel="back" data-icon="arrow-l" data-transition="slide">Back</a>
</div>
<div data-role="content">
    <ul data-role="listview" data-filter="true">
        <li data-role="list-divider">Colleagues</li>
        <li><a href="#alan" data-transition="slide">
            <img src="images/person.png">
            <h1>Alan Ayckbourn</h1>
            <p>Available</p>
        </a></li>
    </ul>
</div>

Add javascript and(or) server side scripting (e.g. php) and you can turn it into a real application.

Here is a three page mock-up for you.
First item in the list Alan Ayckbourn is clickable.

Upvotes: 1

Related Questions