Return to Snippet

Revision: 51732
at October 2, 2011 23:56 by craigmoss


Initial Code
<!DOCTYPE html> 
<html> 
	<head> 
	<title>Page Title</title> 
	
	
	<!--	By setting the viewport attributes to content="width=device-width, initial-scale=1, the width will be set to the pixel width of the device screen. -->
	<meta name="viewport" content="width=device-width, initial-scale=1"> 

	<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0b3/jquery.mobile-1.0b3.min.css" />
	<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.3.min.js"></script>
	<script type="text/javascript" src="http://code.jquery.com/mobile/1.0b3/jquery.mobile-1.0b3.min.js"></script>
	
</head> 
<body> 

<div data-role="page">


	<header data-role="header">
		<h1>Page Title</h1>
	</header>

	
	<div data-role="content" data-theme="a">	
		
		<ul data-role="listview" data-inset="true" data-filter="true" data-theme="d">
			<li>
				<a href="#"> Some Text </a>
			</li>
			<li>
				<a href="#"> Some Text </a>
			</li>
			<li>
				<a href="#"> Some Text </a>
			</li>

			<li data-role="list-divider"> List Divider	</li>
			
			<li>
				<a href="#"> Some Text </a>
			</li>
			<li>
				<a href="#"> Some Text </a>
			</li>
			<li> Cars
				<ol>
					<li>Some Text</a></li>	
					<li>Some Text</a></li>	
					<li>Some Text</a></li>	
				</ol>
			</li>

			<li data-role="list-divider"> List Divider	</li>
			
			<li>
				<img src="images/two-pirates.jpg" alt="JQuery Mobile" />
				<h3> <a href="#"> My Thumbnails Image </a> </h3>
				<p> Here is a description of the thumnail. </p>
			</li>
			<li>
				<img src="images/add2.ico" alt="JQuery Mobile" class="ui-li-icon" />
				<h3> <a href="#"> My Icon Image </a> </h3>
				<p> Here is a description of the icon. </p>
			</li>
			<li>
				<img src="images/two-pirates.jpg" alt="JQuery Mobile" />
				<h3> 
					<a href="#"> My Thumbnails Image </a> 
					<span class="ui-li-aside"> 5:45pm </span>
				</h3>
				<p> Here is a description of the icon. </p>
			</li>


		</ul>
	</div>

	
	<footer data-role="footer">
		<h4>Page Footer</h4>
	</footer>
	
	
</div><!-- end page -->

</body>
</html>

Initial URL


Initial Description


Initial Title
JQuery Mobile 1 Page Example

Initial Tags
jquery, mobile

Initial Language
jQuery