search

michalsnik / aos

Animate on scroll library
MIT License
26.84k stars 2.6k forks source link

Disable only specific animation #112

Closed Yimiprod closed 6 years ago

Yimiprod commented 7 years ago

Is it possible to disable specific animation for specific device. As an exemple, on mobile, i need some part of the page to not have animation, but always have other parts to have one.

Maybe a data attr like data-aos-disable="mobile" ?

hellokatili commented 7 years ago

You can do it in a media query.

Example: Disable "slide left" transition

@media(max-width: 767px){
    .your-selector[data-aos=slide-left] {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}
michalsnik commented 6 years ago

It's not possible by default. You can however create your own animations and use @media query to target specific screens like @hellokatili proposed.