rx3mer Posted April 23, 2013 Share Posted April 23, 2013 (edited) Hi guys, I have added simple CSS3 opacity animation on scroll down and everything works. Now I am trying to add cool bounce CSS3 effect and it works but disappears after the effect is completed. The effect is applyed to the 'footer' with "addClass('animated bounceInDown');". I don't think that is CSS problem as the animation should just stop playing when its done. Any ideas? <script type="text/javascript"> $(document).ready(function() { /* Every time the window is scrolled ... */ $(window).scroll( function(){ /* Check the location of each desired element */ $('.hideme','footer').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 ){ $(this).animate({'opacity':'1'},500); $(this).addClass('animated bounceInDown'); } }); $('img').load(function() { $(this).addClass('active'); }); }); }); </script> Edited April 23, 2013 by rx3mer Quote Link to comment https://forums.phpfreaks.com/topic/277209-scroll-animation/ Share on other sites More sharing options...
rx3mer Posted April 23, 2013 Author Share Posted April 23, 2013 problem solved. It was the CSS Quote Link to comment https://forums.phpfreaks.com/topic/277209-scroll-animation/#findComment-1426130 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.