Friday, 23 August 2013

Trouble getting jquery mobile panels to work

Trouble getting jquery mobile panels to work

So I'm clearly making a stupid mistake here...but I've been stuck on it
for a while. I'm trying to test out the panel widget in jquery mobile but
I cannot get it to work. Here's my code. Anybody know what's wrong?
<!DOCTYPE html>
<html>
<head>
<title class="identifying" id="TOC-proof-of-concept.html">Table of
Contents</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css"
/>
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script
src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
<script src="../Support/js/jStorage.js"></script>
<script src="../Support/js/bookmark.js"></script>
</head>
<body>
<div data-role="page">
<div data-role="panel" id="mypanel">
<p>panel content</p>
</div><!-- /panel -->
<div data-role="header">
<p>sample text blah blah</p>
</div>
<div data-role="content">
<a href="#mypanel">Open panel</a>
</div>
<div date-role="footer">
here is some footer text
</div>
</div><!-- page -->
</body>
</html>

No comments:

Post a Comment