L’implementazione dello Smooth Scroll di uikit è estremamente semplice.

Si tratta infatti, da una parte, di individuare l’id dell’elemento in corrispondenza del quale far scorrere, automaticamente, la finestra del browser e, dall’altra parte, di creare un’ apposito link utilizzando come destinazione del collegamento (valore della proprietà href) l’id in questione, assegnando inoltre al link stesso l’attributo data-uk-smooth-scroll

Supponendo dunque di aver utilizzato all’interno della pagina web un elemento con id=my-id, per creare un pulsante mediante il quale far scorrere automaticamente la finestra del browser in corrispondenza di tale elemento e attivare anche l’effetto di rallentamento, sarà sufficiente inserire all’interno della stessa pagina il seguente link

<a href="#my-id" class=" " data-uk-smooth-scroll>

Vai all’elemento my-id

</a>

Se necessario è anche possibile impostare un offset mediante il quale poter specificare quanti pixel, prima o dopo il target indicato, dovrà terminare lo scroll automatico della finestra del browser.

Nello specifico assegnando, ad esempio, al link utilizzato per attivare lo scroll automatico l’attributo:

• data-uk-smooth-scroll="{offset: 90}" : lo scroll automatico del browser terminerà 90 pixel prima dell’elemento target
• data-uk-smooth-scroll="{offset: -90}" : lo scroll automatico del browser terminerà 90 pixel dopo l’elemento target