Jump to content

show div element when it appears on screen


Exoskeletor
 Share

Recommended Posts

im trying to build code than animates some divs when they appear with the help of this codehttp://jsfiddle.net/tcloninger/e5qaD/so far i have write this code

Code:<script>$(document).ready(function() {/* Every time the window is scrolled ... */$(window).scroll( function(){/* Check the location of each desired element */$('#art-1').each( function(i){var bottom_of_object = $(this).position().top + $(this).outerHeight();var bottom_of_window = $(window).scrollTop() + $(window).height();/* If the object is completely visible in the window, fade it it */if( bottom_of_window > bottom_of_object ){        function showElement1() {$('#art-1').addClass(' art animate');}        function showElement2() {$('#art-2').addClass(' art animate');}        function showElement3() {$('#art-3').addClass(' art animate');}setTimeout(showElement1, 0); /* show immediately */setTimeout(showElement2, 500); /* show after half second */setTimeout(showElement3, 1000); /* show after one second */}});    $('#art-4').each( function(i){var bottom_of_object = $(this).position().top + $(this).outerHeight();var bottom_of_window = $(window).scrollTop() + $(window).height();/* If the object is completely visible in the window, fade it it */if( bottom_of_window > bottom_of_object ){function showElement4() {$('#art-4').addClass(' art animate');}        function showElement5() {$('#art-5').addClass(' art animate');}        function showElement6() {$('#art-6').addClass(' art animate');}setTimeout(showElement4, 0); /* show immediately */setTimeout(showElement5, 500); /* show after half second */setTimeout(showElement6, 1000); /* show after one second */}});});});</script>

but this code animates the element on page load not when they appear. do you know guys what i have done wrong?

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...