Animate Html Elements everytime you scroll in viewport

By admin / 3:39 am, 15 Apr 2016 / CSS, jQuery / 0 Comment

You have been used so may plugins for revelaing HTML contents with animation in your website. As for example if you have used Wow.js , you must have noticed that it triggers animation only once when you scroll in contents in viewport.

What if you want animation triggers everytime you scroll in?

There is a solution – inViewport.js.
It enables you to trig animation only when content is in viewport. This is all we are trying to get. 🙂

In this trick i am using my own custom CSS for animation.
This is CSS part :-

class:slideanimlr for animating content left to right
class:slideanimrl for animating content right to left
class:slideanimzoom for animating content zoom in
class:slideanimbt for animating content bottom to top

 

Here is the js part :-

Now add any of the above written class or your own animation in your content and let your content reveal with animation everytime you scroll in viewport 🙂

Previous Post
Next Post