Aos: How to target an element class or id and not use data-aos

Created on 15 Oct 2018  路  3Comments  路  Source: michalsnik/aos

We cannot edit the code output to add in data-aos attribute

So how could we use this without data-aos? Normally these things can target elements by class or ID.

Thanks

Most helpful comment

@selfpubservice Thanks for the snippet, it's helped me incorporate the plugin into a CMS environment. It would be great if we could pass in a class to initialise the plugin against rather than the data attributes as default functionality at some point in the future.

All 3 comments

Same issue here.
Tried to add attributes with jquery, but it doesn't work. Attributes get injected in the elements, but the animation is not working.

Same here. After injecting with jQuery in the document.ready event

jQuery( document ).ready(function() {
    jQuery('.animate').find('h1,h2,h3,h4,h5,p,ul,a').attr('data-aos', 'fade-up');

I reinit AOS in the window.load event:

jQuery( window ).load(function() {
    AOS.refreshHard();

That solves the problem for me.
Peter

@selfpubservice Thanks for the snippet, it's helped me incorporate the plugin into a CMS environment. It would be great if we could pass in a class to initialise the plugin against rather than the data attributes as default functionality at some point in the future.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

VeronikaMilic picture VeronikaMilic  路  4Comments

halverson picture halverson  路  4Comments

timotheegoguely picture timotheegoguely  路  3Comments

noisypope picture noisypope  路  4Comments

jodriscoll picture jodriscoll  路  4Comments