Wednesday, August 4, 2010

JQuery: Setting image properties

The following code sets the src and alt attributes for all images



$("img").attr({ src: "test.jpg", alt: "Test Image" });



If you want to det just the src attribute, use:


$("img").attr("src","test.jpg");


If you want to set Title attribute of an image to reflect image filename, use:


$("img").attr("title", function() { return this.src });

JQuery: $(document).ready() vs. $(window).load()

$(document).ready() executes when the DOM is fully loaded (ex.: an 'element')

$(document).ready() is ideal for one-time initialization routines

$(window).load() executes when the complete page, including all fames, images and objects, is loaded

Suppose you have an iFrame

Code below will find your iFrame and insert the text specified into the body of the document




$(document).ready(function(){
$('#frameID').load(function(){
$('#frameID').contents().find('body').html('My new contents');
});
});

How to access contents of an iFrame from JQuery

Suppose you have an iFrame


<iframe id="iframeID" ...></iframe>


Your iFrame contains div with id=”myDiv”:



<div id="myDiv">DIV contents here</div>


You can retrieve contents of a div using the following line of code:




$('#iframeID').contents().find('#myDiv').html();