| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120 |
- <!DOCTYPE html>
- <!--HTML5 doctype-->
- <html>
- <head>
- <title>List View Template</title>
- <meta http-equiv="Content-type" content="text/html; charset=utf-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, minimal-ui">
- <meta name="apple-mobile-web-app-capable" content="yes" />
- <META HTTP-EQUIV="Pragma" CONTENT="no-cache">
- <meta http-equiv="X-UA-Compatible" content="IE=edge" />
- <link rel="stylesheet" type="text/css" href="../build/icons.css" />
- <link rel="stylesheet" type="text/css" href="../build/af.ui.css" />
- <script type="text/javascript" charset="utf-8" src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
- <script type="text/javascript" charset="utf-8" src="http://cdnjs.cloudflare.com/ajax/libs/fastclick/1.0.3/fastclick.min.js"></script>
- <script type="text/javascript" charset="utf-8" src="../build/appframework.ui.js"></script>
- </head>
- <body>
- <div id="splashscreen" class='ui-loader heavy'>
- App Framework - List View
- <br>
- <br>
- <span class='ui-icon ui-icon-loading spin'></span>
- <h1>Starting app</h1>
- </div>
- <div class="view" id="mainview">
- <header>
- <h1>List View Example</h1>
- </header>
- <div class="pages">
- <!--Initial List of items-->
- <div class="panel" data-title="List" id="list" data-selected="true">
- <ul class="list">
- <li><a href="#item1">Item 1</a></li>
- <li><a href="#item2">Item 2</a></li>
- <li><a href="#item3">Item 3</a></li>
- <li><a href="#item4">Item 4</a></li>
- <li><a href="#item5">Item 5</a></li>
- <li><a href="#item6">Item 6</a></li>
- <li><a href="#item7">Item 7</a></li>
- <li><a href="#item8">Item 8</a></li>
- <li><a href="#item9">Item 9</a></li>
- <li><a href="#item10">Item 10</a></li>
- <li><a href="#item11">Item 11</a></li>
- <li><a href="#item12">Item 12</a></li>
- </ul>
- </div>
- <!--Detail View Pages for each list item-->
- <div class="panel" data-title="Item 1" id="item1" data-footer="none">
- <p>This is detail view for Item 1</p>
- </div>
- <div class="panel" data-title="Item 2" id="item2" data-footer="none">
- <p>This is detail view for Item 2</p>
- </div>
- <div class="panel" data-title="Item 3" id="item3" data-footer="none">
- <p>This is detail view for Item 3</p>
- </div>
- <div class="panel" data-title="Item 4" id="item4" data-footer="none">
- <p>This is detail view for Item 4</p>
- </div>
- <div class="panel" data-title="Item 5" id="item5" data-footer="none">
- <p>This is detail view for Item 5</p>
- </div>
- <div class="panel" data-title="Item 6" id="item6" data-footer="none">
- <p>This is detail view for Item 6</p>
- </div>
- <div class="panel" data-title="Item 7" id="item7" data-footer="none">
- <p>This is detail view for Item 7</p>
- </div>
- <div class="panel" data-title="Item 8" id="item8" data-footer="none">
- <p>This is detail view for Item 8</p>
- </div>
- <div class="panel" data-title="Item 9" id="item9" data-footer="none">
- <p>This is detail view for Item 9</p>
- </div>
- <div class="panel" data-title="Item 10" id="item10" data-footer="none">
- <p>This is detail view for Item 10</p>
- </div>
- <div class="panel" data-title="Item 11" id="item11" data-footer="none">
- <p>This is detail view for Item 11</p>
- </div>
- <div class="panel" data-title="Item 12" id="item12" data-footer="none">
- <p>This is detail view for Item 12</p>
- </div>
- </div>
- <!--Footer to add tabs if desired-->
- <footer>
- <a href="#main" class="" id='tab1' ></a>
- </footer>
- </div>
- </body>
- </html>
|
