There a many situations where you need to check if a page and its elements are available to update or alter via JQuery. Example include activating JQuery animations, reading the contents of an iframe or interacting with Flash.
There are two JQuery commands that should be part of every web developers tool kit when dealing with dynamic JQuery content.
The first is JQuery $(document).ready() handler.
E.g.
$(document).ready(function(){ //do stuff });
It's late but I have just finished uploading the final release version of JSlideshow. Check it out, it's a very simple JQuery plugin for creating slideshows and carousels.
You can download the plugin from the digital products section of my portfolio.
If you have any questions then let me know.
Whilst recently working on a micro-site - http://baa.t3.com - I was tasked with creating an interaction style similar to Flash. So I decided to use jQuery to quickly create a product information display that would initiate on mouse over / hover.
The final result is easy on the eye and fully supported across multiple browsers and devices.
I am very keen to move away from Adobe Flash and have been getting up to speed with HTML5, CSS3 and Jquery to produce cross platform interactivity that degrades nicely across browsers.
If the jQuery dollar symbol short code is unavailable because you have assigned it to a different variable or you have used jQuery.noConflict(); to resolve potential conflicts between jQuery and Prototype then simply use the string jquery to access jQuery commands. I.e.
$(window).load(function() { callFunction(); });
Becomes
jquery(window).load(function() { callFunction(); });
You can also set your own short code for use with jquery such as: var $_shortcode = jQuery;
Over the weekend I was struggling to find a way to test if all content had been loaded into the browser before making a function call. Well I found the answer:
$(window).load(function() { callFunction(); });
This little snippet waits until all external content has loaded before making the function call. So if you need all static files - images, javascript, flash, etc - to be fully loaded before firing an event then use the above snippet.
