Add one class when visible

How?

• Add data-awty="classname" on the html element
• voilá :)

Add many classes when visible

How?

• Add data-awty="classname1,classname2" on the html element
• voilá

Add classes when element is centered

How?

• Add data-awty="classname"
• data-awty-mode="center"

Add class when a % of element is visible

How?

• Add data-awty="classname" on the html element
• Define mode data-awty-mode="peek"
• Define percentage data-awty-space="0.35"

Add class temporarily using any of the awty modes

How?

• Add data-awty="classname" on the html element
• Define awty mode (if you want to) data-awty-mode="peek"
• Activate the toggle option data-awty-toggle="true"

Or Add classes after a certain margin

How?

• Add data-awty="classname" on the html element
• Define mode data-awty-mode="peek"
• Define percentage data-awty-space="0.35"

And that's it :)