Hopiu/jquery-mobile
1
0
Fork 0
mirror of https://github.com/Hopiu/jquery-mobile.git synced 2026-04-24 08:04:43 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

demo markup cleanup

Browse source
This commit is contained in:
scottjehl 2010-10-09 08:57:57 -04:00
parent 7032e8330f
commit 00c28aff4d
11 changed files with 17 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
_dialog.html
View file

@ -13,7 +13,7 @@
</div>
<div data-role="content" class=" ui-body ui-body-c">
<div data-role="content" data-theme="c" class=" ui-body">
<h1>Demo description</h1>
<p>This is a regular page, styled as a dialog! To create a dialog, just link to a normal page and include a transition and <code>data-rel="dialog"</code> attribute.</p>
<p>Try loading a taller page to see how the headers and footers work: <a href="_fixed.html" data-transition="pop" data-rel="dialog">Fixed Headers/Footers</a></p>

2
_filter.html
View file

@ -8,7 +8,7 @@
</head>
<body>
<div data-role="page" class="ui-body-c">
<div data-role="page">
<div data-role="header">
<h1>Songs</h1>

9
_fixed-variation1.html
View file

@ -7,19 +7,17 @@
</head>
<body>
<div data-role="page">
<div data-role="page" data-fullscreen="true">
<div data-role="header" data-headfoottransition="fade">
<div data-role="header">
<h1>Fixed Header</h1>
</div>
<div data-role="content">
<div class="ui-body ui-body-c">
<div data-role="content" class="ui-body">
<h2>Demo description</h2>
<p>This is a demo of the "fixed" headers and footers used in the jQuery Mobile framework. The page content flows naturally, allowing us to take advantage of native scrolling instead of a scripting a faux-scrolling workaround. The header and footer divs are right in the flow of the document, but whenever they are out of view, you can tap the screen to make them appear. Tapping again or scrolling the page will cause them to appear back in the flow of the page (at the top and bottom). </p>
<a href="_fixed-variation2.html" data-role="button" data-theme="b" data-icon="arrow-r" data-iconpos="right">Hey! Try them with overlay-only enabled</a>
<p><strong>Pellentesque habitant morbi tristique</strong> senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. <em>Aenean ultricies mi vitae est.</em> Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, <code>commodo vitae</code>, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. <a href="#">Donec non enim</a> in turpis pulvinar facilisis. Ut felis.</p>
@ -104,7 +102,6 @@
</code></pre>
</div>
</div>
<div data-role="footer">
<h1>Fixed Footer</h1>

7
_fixed.html
View file

@ -13,12 +13,12 @@
<h1>Fixed Header</h1>
</div>
<div data-role="content">
<div class="ui-body ui-body-c">
<div data-role="content" class="ui-body">
<h2>Demo description</h2>
<p>This is a demo of the "fixed" headers and footers used in the jQuery Mobile framework. The page content flows naturally, allowing us to take advantage of native scrolling instead of a scripting a faux-scrolling workaround. The header and footer divs are right in the flow of the document, but whenever they are out of view, you can tap the screen to make them appear. Tapping again or scrolling the page will cause them to appear back in the flow of the page (at the top and bottom). </p>
<!-- <a href="_fixed-variation1.html" data-role="button" data-theme="b" data-icon="arrow-r" data-iconpos="right">Hey! Try them with fade transitions too!</a> -->
<a href="_fixed-variation1.html" data-role="button" data-theme="b" data-icon="arrow-r" data-iconpos="right">Hey! Try them with fullscreen content enabled</a>
<p><strong>Pellentesque habitant morbi tristique</strong> senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. <em>Aenean ultricies mi vitae est.</em> Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, <code>commodo vitae</code>, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. <a href="#">Donec non enim</a> in turpis pulvinar facilisis. Ut felis.</p>
@ -103,7 +103,6 @@
</code></pre>
</div>
</div>
<div data-role="footer">
<h1>Fixed Footer</h1>

4
_footer-persist-result.html
View file

@ -14,8 +14,7 @@
</div>
<div data-role="content">
<div class="ui-body ui-body-c">
<div data-role="content" class="ui-body">
<h2>Demo description</h2>
<p>The footer on this page should have persisted. </p>
@ -103,7 +102,6 @@
</code></pre>
</div>
</div>
<div data-role="footer" data-id="foo1">
<h1>Sticky Footer 2</h1>

5
_footer-persist.html
View file

@ -14,8 +14,7 @@
</div>
<div data-role="content">
<div class="ui-body ui-body-c">
<div data-role="content" class="ui-body">
<h2>Demo description</h2>
<p>This is a demo of a persistent footer. The footer on this page should stick when transitioning to the next page, because they have the same data-id attributes. </p>
@ -103,7 +102,7 @@
}
</code></pre>
</div>
</div>
<div data-role="footer" data-id="foo1">

2
_form-controls.html
View file

@ -18,7 +18,7 @@
<div data-role="content">
<form class="ui-body-c" action="#" method="get">
<form action="#" method="get">
<div data-role="collapsible" data-state="collapsed">
<h1>Demo description</h1>

2
_navbar.html
View file

@ -25,7 +25,7 @@
</div>
</div>
<div data-role="content" class=" ui-body ui-body-b">
<div data-role="content" class=" ui-body">
<h1>Demo description</h1>
<p>This page includes a examples of the navbar plugin, which can be called on a div containing a UL.</p>

4
_transitions-destination.html
View file

@ -12,8 +12,7 @@
<div data-role="header" data-theme="b">
<h1>Done!</h1>
</div>
<div data-role="content">
<div class="ui-body">
<div data-role="content" class="ui-body">
<h1>HTML Ipsum Presents</h1>
<p><strong>Pellentesque habitant morbi tristique</strong> senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. <em>Aenean ultricies mi vitae est.</em> Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, <code>commodo vitae</code>, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. <a href="#">Donec non enim</a> in turpis pulvinar facilisis. Ut felis.</p>
@ -34,7 +33,6 @@
<li>Aliquam tincidunt mauris eu risus.</li>
</ul>
</div>
</div>
</div>

4
_transitions.html
View file

@ -11,8 +11,8 @@
<div data-role="header">
<h1>Transitions</h1>
</div>
<div data-role="content" class=" ui-body-c">
<ul data-role="listview" data-fill-width="false">
<div data-role="content">
<ul data-role="listview" data-inset="true" data-fill-width="false">
<li><a href="_transitions-destination.html" data-transition="slide">slide</a></li>
<li><a href="_transitions-destination.html" data-transition="slideup">slideup</a></li>
<li><a href="_transitions-destination.html" data-transition="slidedown">slidedown</a></li>

2
index.html
View file

@ -12,7 +12,7 @@
<h1>jQuery Mobile</h1>
</div>
<div data-role="content" class=" ui-body-b">
<div data-role="content">
<ul data-role="listview" data-fill-width="false">
<li><a href="docs/index.html">Documentation</a></li>
<li><a href="_containers-states.html">Containers &amp; states</a></li>