Skip to content

Instantly share code, notes, and snippets.

@MonsieurDart

MonsieurDart/gist:1165071

Created August 23, 2011 13:17
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save MonsieurDart/1165071 to your computer and use it in GitHub Desktop.
Save MonsieurDart/1165071 to your computer and use it in GitHub Desktop.
Download ZIP
jQuery Mobile Transition Test Case
Raw
gistfile1.txt
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery Mobile Transition Test Case</title>
</head>
<body>
<link rel="stylesheet" href="jquery.mobile-1.0b2.min.css" />
<script src="jquery-1.6.2.min.js"></script>
<script src="jquery.mobile-1.0b2.min.js"></script>
<script type="text/javascript">
function testCase(shouldChangePage) {
$.ajax({
dataType:'jsonp',
url: 'http://www.atelierdumobile.com/json/jsonp.php?url=http://iphone.eamobi.com/data/feed/1.0/websites',
success: function (response) {
// Do nothing…
if (shouldChangePage) {
$.mobile.changePage("#articles", { transition: "slide"});
}
}
});
}
</script>
</body>
<div data-role="page" id="sites">
<div data-role="header" data-theme="e">
<h1><div class="list-nav-title">Home</div></h1>
</div>
<div data-role="content">
<ul id="sitesDisplay" data-role="listview">
<li><a href=#articles onClick="">Test case 0</a></li>
<li><a href=#articles onClick="testCase(false);">Test case 1</a></li>
<li><a onClick="testCase(true);">Test case 2</a></li>
</ul>
</div>
</div>
<div data-role="page" id="articles">
<div data-role="header" data-theme="e">
<h1><div class="list-nav-title">Other Mobile Page</div></h1>
</div>
<div data-role="content">
Hello world!
</div>
</div>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment