jquery-mobile/docs/pages/link-formats.html
Kin Blas 161f5e6ae3 Removed jquery.js from js/index.php and updated all html doc/experiments/test files that incuded "js/" so that they also include jquery.js manually.
This makes our include model match the include model on the CDN, and allows devs to make use of mobileinit for debugging some of the samples since that must be set up after jquery.js, but before jquery-mobile.
2011-01-20 11:26:12 -08:00

49 lines
No EOL
2.7 KiB
HTML
Executable file

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>jQuery Mobile Docs - Links</title>
<link rel="stylesheet" href="../../themes/default/" />
<link rel="stylesheet" href="../_assets/css/jqm-docs.css"/>
<script type="text/javascript" src="../../js/jquery.js"></script>
<script type="text/javascript" src="../../js/"></script>
<script type="text/javascript" src="docs/docs.js"></script>
</head>
<body>
<div data-role="page">
<div data-role="header">
<h1>Link formats</h1>
</div><!-- /header -->
<div data-role="content">
<p>All standard HTML link types are supported in jQuery Mobile. To make the experience as polished as possible, any links to pages within the same domain will be automatically turned into Ajax requests and displayed with an animated page transition by the framework. </p>
<p>Links that point to other domains or that have <code>rel="external"</code> or <code>target</code> attributes will not be loaded with Ajax and will cause a full page refresh. If multiple "pages" are contained within a single HTML document, they can be linked by referencing the ID of the page as an anchor (#foo).</p>
<p>All other types of links like <code>mailto:</code> and <code>tel:</code> aren't impacted by the framework and will work as expected. Learn more about the <a href="docs-navmodel.html">linking and navigation model</a> in jQuery Mobile</p>
<ul data-role="listview" data-inset="true">
<li data-role="list-divider">Links that will be Ajax-loaded with page transitions</li>
<li><a href="../../index.html">Link in the same domain</a></li>
<li><a href="../pages/dialog.html" data-rel="dialog">Dialog link: data-rel="dialog" (not tracked in history)</a></li>
<li data-role="list-divider">Links that will refresh the page</li>
<li><a href="http://www.jquery.com">External domain</a></li>
<li><a href="../../index.html" rel="external">Link with rel="external"</a></li>
<li><a href="../../index.html" target="foo">Link with target="foo"</a></li>
<li data-role="list-divider">Email links</li>
<li><a href="mailto:jdoe@foo.com">Basic email: mailto:jdoe@foo.com</a></li>
<li><a href="mailto:jdoe@foo.com?cc=bill@bar.com&bcc=mark@abc.com&subject=Happy%20Birthday&body=Best%20wishes!">Mailto with a cc:, bcc:, subject and body pre-filled</a></li>
<li data-role="list-divider">Phone links</li>
<li><a href="tel:15555555555">Phone: tel:15555555555</a></li>
<li><a href="wtai://wp/mc;15555555555">Phone: wtai://wp/mc;15555555555</a></li>
<li><a href="dc:234*234*234">Phone: dc:234*234*234</a></li>
<li data-role="list-divider">Other</li>
<li><a href="#">A href="#" will return false</a></li>
</ul>
</div><!-- /content -->
</div><!-- /page -->
</body>
</html>