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

fixed code example formatting

Browse source
This commit is contained in:
Todd Parker 2010-10-12 17:23:48 -04:00
parent c83c10f5bf
commit 71bd3a114a
3 changed files with 12 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
docs/pages/docs-dialogs.html
View file

@ -2,7 +2,7 @@
<html>
<head>
<title>jQuery Mobile Docs - Pages</title>
<link rel="stylesheet" href="../../css/all" />
<link rel="stylesheet" media="only all" href="../../css/all" />
<script type="text/javascript" src="../../js/all"></script>
</head>
<body>
@ -13,20 +13,21 @@
<h1>Dialogs</h1>
</div><!-- /header -->
<div data-role="content">
<div data-role="content" class="ui-body">
<p>Any page can be presented as a dialog by adding the </a>data-rel="dialog"</code> attribute to the page you're linking to. The framework will add styles to make the page look like a modal dialog by adding rounded corners and margins around the page along with a dark background behind the "dialog".</p>
<p>The dialog will still open with the standard slide transition so to make it feel more dialog-like, we recommend adding a transition of pop, slideup or flip on the link too.</p>
<pre><code>
<code>
&lt;a href=&quot;foo.html&quot; data-rel=&quot;dialog&quot; data-transition=&quot;pop&quot;&gt;Open dialog&lt;/a&gt;
</pre></code>
</code>
<div>
<a href="dialog.html" data-role="button" data-inline="true" data-rel="dialog" data-transition="pop">Open dialog: pop</a>
<a href="dialog.html" data-role="button" data-inline="true" data-rel="dialog" data-transition="slideup">Open dialog: slideup</a>
<a href="dialog.html" data-role="button" data-inline="true" data-rel="dialog" data-transition="flip">Open dialog: flip</a>
</div>

8
docs/pages/docs-links.html
View file

@ -34,7 +34,7 @@
<p>Here is an example of a 2 "page" site built with two jQuery Mobile divs navigated by linking to an ID placed on each page wrapper. Note that the IDs on the page wrappers are only needed to support the internal page linking and are optional if each page is a separate HTML document.</p>
<div class="highlight">
<pre><span class="nt">&lt;div</span> <span class="na">data-role=</span><span class="s">"page"</span> <span class="na">id=</span><span class="s">"foo"</span><span class="nt">&gt;</span>
<code><span class="nt">&lt;div</span> <span class="na">data-role=</span><span class="s">"page"</span> <span class="na">id=</span><span class="s">"foo"</span><span class="nt">&gt;</span>
<span class="nt">&lt;div</span> <span class="na">data-role=</span><span class="s">"content"</span><span class="nt">&gt;</span>
I'm the "foo" page. Since I'm the first page
in the source order, I will be displayed onLoad.
@ -49,7 +49,7 @@
page is clicked.
<span class="nt">&lt;/div&gt;</span><span class="nt">&lt;!-- /content --&gt;</span>
<span class="nt">&lt;/div&gt;&lt;!-- /bar page --&gt;</span>
</pre>
</code>
</div>
@ -65,9 +65,9 @@
<p>To set a custom transition effect, add the <code>data-transition</code> attribute to the link. Possible values include: </p>
<pre><code>
<code><code>
&lt;a href=&quot;index.html&quot; data-transition=&quot;pop&quot;&gt;I'll pop&lt;/a&gt;
</pre></code>
</code></code>
<a href="../_transitions-destination.html" data-role="button" data-inline="true" data-transition="slide">slide</a>
<a href="../_transitions-destination.html" data-role="button" data-inline="true" data-transition="slideup">slideup</a>
<a href="../_transitions-destination.html" data-role="button" data-inline="true" data-transition="slidedown">slidedown</a>

4
docs/pages/docs-pages.html
View file

@ -2,7 +2,7 @@
<html>
<head>
<title>jQuery Mobile Docs - Pages</title>
<link rel="stylesheet" href="../../css/all" />
<link rel="stylesheet" media="only all" href="../../css/all" />
<script type="text/javascript" src="../../js/all"></script>
</head>
<body>
@ -13,7 +13,7 @@
<h1>Anatomy of a Page</h1>
</div><!-- /header -->
<div data-role="content">
<div data-role="content" class="ui-body">
<p>Following HTML markup conventions is essential to this approach because markup is the primary mechanism used to configure the mobile experience in jQuery Mobile. Validate your code and always avoid the use of inline styles or inline JavaScript event handlers to ensure the best results.</p>