Name: Anonymous 2010-04-04 13:16
Is it possible to have content in a hidden div that doesn't load until it is revealed? I know you got dem answers /prog/.
<html>
<head>
<title>jQuery Load Event Test</title>
</head>
<body>
<input type="button" value="Reveal Dat Div" />
<div id="reveal" style="display: none"></div>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('body').bind('onReveal', function() {
$('#reveal')
.html('<img src="http://anime-wallpapers.com/images/1024x768/ash-and-pikachu.jpg" alt="loads when event is triggered" />')
.show();
/*
if you want to wait until the content in that div is fully loaded before you show(),
you'll need to attach load listeners to all the child img, script, iframe, etc.
in this case, you're probably better off using ajax get() instead.
*/
});
$('input:button').click(function() {
$('body').trigger('onReveal');
});
});
</script>
</body>
</html>