Skip to content

Instantly share code, notes, and snippets.

@NatalieMac
Created April 5, 2014 16:47
Show Gist options
  • Save NatalieMac/9994435 to your computer and use it in GitHub Desktop.
Save NatalieMac/9994435 to your computer and use it in GitHub Desktop.
Link Location jQuery Plugin
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Link Location Plugin</title>
<link rel="stylesheet" href="styles/style.css">
</head>
<body>
<h1>Here's a bunch of links</h1>
<ul>
<li><a href="http://google.com">Google</a></li>
<li><a href="http://twitter.com">Twitter</a></li>
<li><a href="http://amazon.com">Amazon</a></li>
<li><a href="http://techjobsla.com">TechJobs LA</a></li>
<li><a href="http://yahoo.com">Yahoo</a></li>
</ul>
<script src="scripts/jquery-2.1.0.min.js"></script>
<script src="scripts/jquery.linklocation.js"></script>
<script>
$('a').linkLocation();
</script>
</body>
</html>
(function($, window, document, undefined){
$.fn.linkLocation = function(){
return this.filter('a').append(function(){
return " (" + this.href + ")";
});
};
}(jQuery, window, document));
body {
background: #7cc0cb;
font-family: Geneva, "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;
margin: 1em auto;
max-width: 45em;
}
h1, h2, h3, h4, h5, h6 {
font-family: Geneva, Verdana, "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment