Jquery mobile 1.1 multipage

by lulalala

HTML

<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.css">
<div data-role="page" id="index">

    <div data-role="header">
        <h1>Page Title</h1>
    </div><!-- /header -->

    <div data-role="content">    
        <a data-role="button" href="#cat1">Cat 1</a>                
        <a data-role="button" href="#cat1">Cat 2</a>                
    </div><!-- /content -->

    <div data-role="footer">
        <h4>Page Footer</h4>
    </div><!-- /footer -->
</div><!-- /page -->
<div data-role="page" id="cat1">

    <div data-role="header">
        <a data-rel="back">Back</a>
        <h1>Page Title</h1>
    </div><!-- /header -->

    <div data-role="content">    
        <p>Cat 1</p>
        <a href="http://jsfiddle.net/lulalala/nuL6h/show/light/"> Item 1 detail </a>
    </div><!-- /content -->

    <div data-role="footer">
        <h4>Page Footer</h4>
    </div><!-- /footer -->
</div><!-- /page -->
<div data-role="page" id="cat2">

    <div data-role="header">
        <a data-rel="back">Back</a>
        <h1>Page Title</h1>
    </div><!-- /header -->

    <div data-role="content">    
        <p>Cat 2</p>        
    </div><!-- /content -->

    <div data-role="footer">
        <h4>Page Footer</h4>
    </div><!-- /footer -->
</div><!-- /page -->