Skip to content

Instantly share code, notes, and snippets.

@jakejarvis
Created July 12, 2013 14:04
Show Gist options
  • Save jakejarvis/5984703 to your computer and use it in GitHub Desktop.
Save jakejarvis/5984703 to your computer and use it in GitHub Desktop.
<html>
<head>
<title>Page Test</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</head>
<body>
<div id="page1_content">
<h1>Page 1</h1>
<p>waeowiaejfoiwejfaowief</p>
</div>
<div id="page2_content">
<h1>Page 2</h1>
<p>asdafweofinawefoinawef</p>
</div>
<p id="page_links"><a href="#" id="page1_link">Page 1</a> <a href="#" id="page2_link">Page 2</a></p>
<script>
$(document).ready(function() { // on page load, show Page 1 and hide Page 2
$("#page1_content").css("display", "inline");
$("#page2_content").css("display", "none");
});
$("#page1_link").click(function() { // when Page 1 is pressed, show Page 1 and hide Page 2
$("#page1_content").css("display", "inline");
$("#page2_content").css("display", "none");
});
$("#page2_link").click(function() { // when Page 2 is pressed, hide Page 1 and show Page 2
$("#page1_content").css("display", "none");
$("#page2_content").css("display", "inline");
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment