Skip to content

Instantly share code, notes, and snippets.

@mhenke
Created March 3, 2013 18:57
Show Gist options
  • Save mhenke/5077634 to your computer and use it in GitHub Desktop.
Save mhenke/5077634 to your computer and use it in GitHub Desktop.
jQuery Mobile - Part 2 envy band jquery mobile codeschool
<!DOCTYPE html>
<html>
<head>
<title>Envy Band</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
</head>
<body>
<div id="venue" data-role="page">
<div data-role="header" data-id="nav" data-position="fixed">
<h1>Orlando</h1>
<a href="/" data-icon="home">Home</a>
<div data-role="navbar">
<ul>
<li><a href="#venue" data-icon="info" data-transition="fade" class="ui-button-active ui-state-persist">Venue</a></li>
<li><a href="#request" data-icon="plus" data-transition="slide">Request</a></li>
<li><a href="#merch" data-icon="star" data-transition="pop">Merch</a></li>
</ul>
</div>
</div><!-- /header -->
<div data-role="content">
<h4>Hard Rock Live - June 6, 6:30pm</h4>
<img src="here.jpg">
</div><!-- /content -->
</div><!-- /page -->
<div id="request" data-role="page">
<div data-role="header" data-id="nav" data-position="fixed">
<h1>Orlando</h1>
<a href="/" data-icon="home">Home</a>
<div data-role="navbar">
<ul>
<li><a href="#venue" data-icon="info" data-transition="fade">Venue</a></li>
<li><a href="#request" data-icon="plus" data-transition="slide" class="ui-button-active ui-state-persist">Request</a></li>
<li><a href="#merch" data-icon="star" data-transition="pop">Merch</a></li>
</ul>
</div>
</div><!-- /header -->
<div data-role="content">
<h4>Request a Song</h4>
<form>
<div data-role="fieldcontain">
<label for="name">Your Name</label>
<input type="text" id="name"/>
</div>
<div data-role="fieldcontain">
<label for="title">Song Title</label>
<input type="text" id="title"/>
</div>
<button type="submit">Request It!</button>
</form>
</div><!-- /content -->
</div><!-- /page -->
<div id="merch" data-role="page">
<div data-role="header" data-id="venue" data-position="fixed">
<h1>Orlando</h1>
<a href="/" data-icon="home">Home</a>
<div data-role="navbar">
<ul>
<li><a href="#venue" data-icon="info" data-transition="fade">Venue</a></li>
<li><a href="#request" data-icon="plus" data-transition="slide">Request</a></li>
<li><a href="#merch" data-icon="star" data-transition="pop" class="ui-button-active ui-state-persist">Merch</a></li>
</ul>
</div>
</div><!-- /header -->
<div data-role="content">
<h4>Buy Our Stuff</h4>
<div class="ui-grid-a" style="text-align: center;">
<div class="ui-block-a">
<img src="json.jpeg">
<p>JSON T-Shirt</p>
<a href="#" data-role="button">Buy</a>
</div>
<div class="ui-block-b">
<img src="sticker.jpeg">
<p>Logo Sticker</p>
<a href="#" data-role="button">Buy</a>
</div>
</div>
</div><!-- /content -->
</div><!-- /page -->
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment