🔥 Classify 4: A tiny plugin that brings CSS classes and +

@anthony.schanen @Christophe_HK

It is actually possible. I know I haven’t written the documentation for this, but the plugin supports javascript commands as well.

Classify normally works by inserting commands inside curly brackets ({addClass...}), but you can also run a javascript command by using square brackets instead.
So for exemple, if you had a condition on an element when hovered that changed the ID attribute to [console.log('hey')], every time the element would be hovered, “hey” would print out in the console.
Additionally, Classify provides the variable ‘p’ to be used with the command that contains nodes in the context of the element.

Back to your question Anthony, in javascript you would normally write something like myDivElement.dataset.aos = "fade-up"; to add the property. With Classify, you can refer to the actual element using p.self. So to add the data property you need to write [p.self.dataset.aos = "fade-up"] (notice there’s no semicolon).

*Currently, you can only insert a single javascript command. If you need to do more, you can write an external function in an HTML element and call it out from the ID attribute: [myFunction(p)].

Hope this help.

5 Likes