In this trick we are going to use a pre-defined method to identify external links on a page. All identified external links are to be embedded with an image to be spotted.
The HTML Mark up
<!-- External Link: -->
Now let us mark the external link with an image using jQuery. We are going to perform this trick by using the keyword location.hostname which captures the base URL.
// Loop through all the links
if(this.hostname != location.hostname)
$(this).append('<img src="external.png" />');
You can possibly play with this trick by binding event listeners to the click, mouseover, etc showing a pop up, slide down and much more…