Sanjeev K Sanjeev K - 1 month ago 4x
HTML Question

Slide in div on scroll from left

I am trying to load the

with slide-in effect from left and right, but this is when I scroll to the current screen and when scroll to the next div, the above element move out from left and right (reverse animation)

How this can be achieved? I tried with the Animate
, so it just slide in on page load but not on scroll, any help?

Here is the JSFiddle of what I have created


Have you tried using .scrollTop() with jQuery? This will start a animation when the user has scrolled a certain amount on your page, for example 300px .scrollTop(300px)

$(window).scroll(function() {
 if ($(this).scrollTop() > 300) {
   $('#yourElement').addClass('animated bounceOutLeft');