Sample JavaScript Code
A new take on your standard rollover code.
function swapFlag(country){
var flagImgObj = document.images[country];
if(!flagImgObj.swap){
flagImgObj.swap = 1;
flagImgObj.src = "images/flags/" + country + "_over.gif";
}
else {
flagImgObj.swap = 0;
flagImgObj.src = "images/flags/" + country + "_off.gif";
}
}
<a href="/en_AA/"
onmouseover="swapFlag('AA');"
onmouseout="swapFlag('AA');"
>
<img src="images/flags/AA_off.gif"
name="AA" alt="Visit Atlantis" />
</a>
This simple JavaScript code does it all with one function. The innovation was to extend the image object by adding the boolean attribute "swap". The if statement tests to see whether .swap is in the off state, or if it hasn't been defined yet. The rest is self explanatory.
...In case you were wondering I couldn't just check for the current source of the image, because in the time it takes for the new source image to load you may have triggered the function several times.
The only downside of compressed rollover code like this is that it is very specialized towards a specific image or set of images and requires a rigidly consistant naming scheme.
