Un’ultima opzione particolarmente interessante da prendere in considerazione per il componente Sticky, è quella che consente di assegnare all’elemento ancorato al bordo superiore della pagina, nel momento in cui diventa “sticky”, una classe CSS personalizzata.

E’ quindi possibile sfruttare questa classe personalizzata per formattare l’elemento in questione quando diventa sticky in maniera diversa da quando non lo è.

Per fare questo è sufficiente utilizzare l’opzione clsactive dell’attributo data-uk-sticky, indicando il nome della classe che si desidera assegnare all’elemento nel momento in cui questo diventerà “sticky”.

Facendo quindi riferimento ad un markup di questo tipo

<div id=”elemento-sticky” data-uk-sticky="{clsactive: 'my-class'>...</div>

nel momento in cui la div “elemento-sticky” andrà ad ancorarsi al bordo superiore del browser gli verrà applicata la classe “.my-class” con le relative formattazioni grafiche.

Operando allo stesso modo è possibile assegnare all’elemento sticky delle classi personalizzate anche nel momento in cui questo diventa “sticky” per la prima volta o quando torna ad essere non sticky. Nello specifico l’opzione:

• clsinit: consente di impostare una classe personalizzata sull’elemento sticky nel momento in cui questo diventerà sticky per la prima volta
• clsinactive: consente di impostare una classe personalizzata sull’elemento sticky che verrà assegnata all’elemento stesso nel momento in cui questo non dovesse essere ancorato alla parte superiore del browser