javascript - fade in and out divs in relation to window position -


i'm trying fadein <div>s class .cms , .seo when entering section id "services" , fadeout when passing section or before.

i want animate in relation scrolling position if possible.

i give link can check site self.

for animations using animate.css

the javascript code inside js/agency.js

site

this code i've been trying with..

$(window).scroll(function() {     var y=$(window).scrolltop();     if (y < 1092){     $('.cms,.seo').addclass('animated fadeoutright');     }   if (y > 1092 && y < 1300) {     $('.cms,.seo').addclass('animated fadeinright');   }        if (y > 1300){     $('.cms,.seo').addclass('animated fadeoutright');     } }); 

i want know if work on different window sizes or have change code ?

thanks!!

it fades out because if (y < 1092) true scroll.

you want fadeoutright if fadeinright exists on element, way won't hide right away, so:

if (y < 1092 && $('.cms,.seo').hasclass('fadeinright'))

furthermore, since class animated specifies how element animated, apply right away element instead of appending javascript.

see working example on fiddle: https://jsfiddle.net/pjh6gy7e/

it should work on window sizes unless change height of elements responsively.


Comments

Popular posts from this blog

java - pagination of xlsx file to XSSFworkbook using apache POI -

Unlimited choices in BASH case statement -

apache - How do I stop my index.php being run twice for every user -