Show image very slowly ... after page is completely loaded....
That is ,
fade in Effect for the image, but this image should show very slowly page load is completed....
+4
A:
Assuming you meant onload (all assets have downloaded) and not DOMReady (the page itself is ready to go):
$(window).load(function () {
$('img').fadeIn(10000); // 10 seconds
});
Code untested. Don't forget to set images to have an opacity of 0 in your CSS when you start.
Matchu
2010-05-18 14:48:25
> $(window).load(function () {> $('#book').animate({ height: 'show', opacity: 'show' }, 'slow'); > > });i tried somthing like this
Bharanikumar
2010-05-18 14:52:29
A:
alternative approach to @Matchu's, still need the css opacity set to 0
$(document).ready(function () {
$('img').show(10000); // 10 seconds
});
EDIT: this will also animate the hight and width, in addition to the opacity.
derek
2010-05-18 14:52:18
I don't think `show` and `fadeIn` have the same effect - it depends on which he really wants.
Matchu
2010-05-18 14:53:14
$(window).load(function () {$('#book').animate({ opacity: 5.25, left: '+=50', height: 'toggle' }, 5000, function() { // Animation complete. });});with this snippet...but image need to show
Bharanikumar
2010-05-18 15:03:31
@Matchu: from jquery docs: When a duration is provided, .show() becomes an animation method. The .show() method animates the width, height, and opacity of the matched elements simultaneously.
derek
2010-05-18 15:10:08
@derek - Right. `show` animates height and width, as well. `fadeIn` just fades it in.
Matchu
2010-05-18 15:24:12