Posted By

flicity on 11/09/09


Tagged

styling links external


Versions (?)

Who likes this?

1 person have marked this snippet as a favorite

bionickid


Adding class to external links


 / Published in: jQuery
 

URL: http://www.learningjquery.com/2008/08/quick-tip-dynamically-add-an-icon-for-external-links

This code appends a class of external to all all outbound links It includes a fix for Safari which does not recognise internal links that use a different port

  1. $(document).ready(function() {
  2. $('#extlinks a').filter(function() {
  3. return this.hostname && this.hostname.split(":")[0] !== location.hostname.split(":")[0];
  4. }).addClass('externalLink');
  5. });
  6.  
  7.  
  8. //css
  9. .externalLink {
  10. background:url(/myiconpath/myicon.gif) top left no-repeat;
  11. // set background position to suit your needs
  12. padding: 15px 0 0 0;
  13. // set padding to width of icon plus the size of gap you would like
  14. }

Report this snippet  

You need to login to post a comment.