Tooltips

Howto: set the title tag for an image via javascript

In this tutorial we will add some JavaScript to our page which will populate the title tag of an image when the user mouses over the image. This will create tooltips in FireFox (the alt attribute should do the trick normally in Internet Explorer).

The image below shows the desired effect. Mousing over the image in Firefox will populate the title text for the image to the value I have set for the alt attribute, namely: "This is some tooltip text"

Howto:

1. Put the image on your page and set the alt text
   
1. Drag an image widget onto your page, select an image to display
2. In the properties sidebar for the image set the alternative text to what you want to show when the user mouses over the image
2. Add some JavaScript to set your title tags
1. Drag an html widget onto your page
2. Add the following code to the widget:

<script src="http://code.jquery.com/jquery-latest.js"></script> 
<script> 
jQuery.noConflict();

jQuery(document).ready(function(){
    jQuery("img").hover(function(e){
        this.title = this.alt;
    });
});
</script>

That should do the trick!