If you use JavaScript to put some dynamic to your websites you often have the problem to pass parameters to the event-function. One solution is to use closures. With the element of closures you can access outer variables from inner inline functions.
Sometimes in a complex javascript-application you want to display an image when it is fully loaded. Until then you want to show for example a common loading-image
. In this case the best solution is to load the image in background, and then show it to the use. For that you can use the Image-Class provided by the browsers.
This class is the used Class at img-Tags. So you have all known properties, like “src”. With the onload-Event you can then check, if the image was fully loaded or not. An example would be:
1 2 3 | var image = new Image(); $(image).load(function () { alert("picture is fully loaded."); }); image.src="http://www.javahelp.info/wp-content/uploads/2009/11/Bild-80-300x64.png"; |
In the example I use JQuery for event-handling, because this is more comfortable as the normal event-method of JavaScript.
If you use JQuery you can use the effects for dynamically hide and show html-elements, like boxes and so. But how to test if such a element is currently visible or not? JQuery offers here some selectors, named :hidden and :visible, which can be used. If you combine it with the “is” method, you can easily check the state.
1 2 3 | alert($("p").is(":visible")); $("p").hide(); alert($("p").is(":visible")); |
This code would output “true”, “false” for a normal p-tag.