Skip to content

Instantly share code, notes, and snippets.

@stvedt

stvedt/Current Page - global.js

Created October 2, 2012 01:38
Show Gist options
  • Save stvedt/3815657 to your computer and use it in GitHub Desktop.
Save stvedt/3815657 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
Current Page - global.js
$(document).ready(function(){
var pageName = getPage();
$('#nav a').each(function(){
var $this = $(this);
var anchorHref = $this.attr('href');
if( anchorHref == pageName) $this.addClass('current');
});
function getPage(){
var loc = $(location).attr('href');
var splitUrl = loc.split("/");
var page = splitUrl[splitUrl.length - 1];
page = (page =='') ? 'index.html' : page;
return page;
}
});
Raw
Current Page - index.html
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JS and HTML - Current Page</title>
<link href="style.css" rel="stylesheet" type="text/css" media="all" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script src="global.js"></script>
</head>
<body>
<h1>Home</h1>
<div id="nav">
<a href="index.html">Home</a><br>
<a href="about.html">About</a><br>
<a href="contact.html">Contact</a>
</div>
</body>
</html>
Raw
style.css
@charset "UTF-8";
.current{
background-color:#3CF;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment