Following on from Jaspers comment on my blog post regarding my “newly discovered” way of creating new windows on links without using the target=”_blank” attribute, he posted a tidy bit of code based on Mootools that detects all <a> tags on his page, then opens in a new window if it starts with http:// (indicating it being an external link).

That’s cool. So I thought I would do the same using my preferred Javascript framework, jQuery. Here’s my code which has now been implemented on this site & looks like its working just fine…

$('.entry a').each(function(){
    if ($(this).attr('href').substr(0,7) == 'http://')
    {
        $(this).addClass('new-window');
    }
});

What we’re doing - top line, cycle through all <a> tags within the .entry class. Secondly, if the first 7 characters of the Href attribute within our <a> tag equals http://, then add a class to the <a> tag called new-window.

This will then be detected by my other small script on my page, as described here. Job done!

Making a site XHTML Strict and valid can be a little bit of a challenge at first - especially if like me you’re used to very relaxed and quite frankly, non-valid code!

One of the specific things that I found a little annoying when trying to make this site valid is the fact that target=”_blank” is not valid in the XHTML Strict standards. Eh? How’d you get around that then…

Javascript, or better, jQuery of course

Here’s a bit of jQuery code that I found elsewhere on the ‘net that I thought I should share.

$('a.new-window').click(function(){
   window.open(this.href);
   return false;
});

Simply dump that into your jQuery document ready function in your JS file.

Then, if you want to open a link in a new window now, instead of using the target=”_blank” method, simply use class=”new-window” on the <a> tag. Sweeeet!

Checking to make sure a website or page is W3C valid and compliant hasn’t always been high on my list of tasks when building a new page or site in the past, until recently.

The company I work for now is very proud of the fact that most, if not all, of the pages on all of their sites are W3C valid to the Scrict standard. Its a good move I think - it makes the developers code better in the long run, so long as we’re always checking for valid code.

So, to check for valid code on a site, I’ve found a neat addon for Firefox called HTML Validator (original, eh?)

However, I have found it to be a little touch-and-go. Sometimes it just doesn’t seem to comply with W3C standards. So I decided to make a small Bookmarklet / Del.icio.us-style browser brookmark link for the current site you’re viewing. Simply make a new bookmark on your browser, and enter the following code as the bookmark URL:

javascript:(function(){f='http://validator.w3.org/check?uri='+encodeURIComponent(window.location.href)+'';a=function(){if(!window.open(f+'','deliciousuiv5','location=yes,links=no,scrollbars=yes,toolbar=no,width=700,height=550'))location.href=f+'jump=yes'};if(/Firefox/.test(navigator.userAgent)){setTimeout(a,0)}else{a()}})()

Clicking your new bookmark will bring up a new popup window with the URL of the current page you’re viewing, to validate against the W3C site. Neat!