fade in only works after page is in view port

Asked Jul 12 '17 at 06:02

Active Jul 12 '17 at 06:10

Viewed 18 times

this is my code

<img class="Buble2" 
src="http://www.spidycode.com/testing/revibe/images/Bubble-8.png">
<script>
 $(document).ready(function(){
 $(".Buble2").hide(0).delay(500).fadeIn(3000)
  });

 </script>

this fade in works perfectly.but I need that to work the animation after the content is in the viewport.how can I do this

edited Jul 12 '17 at 06:10

asked Jul 12 '17 at 06:02

user94

1

Explain "page is in the viewport"? – Taha Paksu Jul 12 '17 at 06:06
`but I need that to work the animation after the page is in the viewport`=> can you explain this? – Alive to die - Anant Jul 12 '17 at 06:06
The problem I have is that the given animation(images) is placed off screen due to lots of content before it so by the time a user scrolls down to it, the animation has already finished. – user94 Jul 12 '17 at 06:08
so you want to trigger the animation when the div is visible ? – madalinivascu Jul 12 '17 at 06:09
yes @madalin ivascu – user94 Jul 12 '17 at 06:10

fade in only works after page is in view port

0 Answers0