background image
HomeRecent PostsDrupalSearchTagsRSSContactAboutAccount

Adding a new window icon to an external link in a news aggregator block using jQuery

Eric.London's picture

It increases usability to indicator that an external link is going to open a new window. Here is a code snippet that shows how I added a few lines of jQuery to append a "new window" icon to each <li> in my news aggregator block:

<?php
<script type="text/javascript">
var
themePath = '< ?php print base_path() . path_to_theme(); ? >';
$(
document).ready(function(){
 
img = "<img src='" + themePath + "/images/new-window-icon.jpg' />";
  $(
'div.block.block-aggregator div.content div.item-list ul li').each(function(i){
    $(
this).html( $(this).html() + img );
  });
});
</script>
?>