0 Comments

Many websites have started to add a little icon next to external links, so that visitors know that if they follow it, they will leave the website. Here is a small JavaScript that adds a class called external to all off-site links on the page. Just call the function when the page has loaded.

// Sets a class to all external links
function StyleExternalLinks()
{
var divs = document.getElementsByTagName("div");
for (i = 0; i < divs.length; i++)
{
var anchors = divs[i].getElementsByTagName("a");

for (a = 0; a < anchors.length; a++)
{
if (anchors[a].href.substring(0,13) != location.href.substring(0,13))
anchors[a].className += "external";
}
}
}

The function searches all DIV tags for links. Now you just need to style the class in order to display the icon.

a.external {
background: url(../../pics/remote.gif) right top no-repeat;
padding-right: 9px;
}

Here is an icon you can use (right-click and Save picture as...).