BACK
Scris de Marius Chiriac

Animatii JS legate de mouse

Animatiile dintr-un website pot transforma un layout simplu si plictisitor intr-unul dinamic si interesant ce va persista in mintea vizitatorului pentru multa vreme dupa ce a terminat umblat pe site-ul tau.

O animatie populara este cea in care pozitia mouse-ului pe ecran se foloseste la animarea elementelor din pagina. Acest lucru poate fi realizat prin mai multe metode, dar cele mai populare sunt animatiile legate de evenimente de tipul hover, la intrarea si iesirea mouse-ului de pe un element (mousemove, mouseenter, mouseout) sau prin preluarea coordonatelor cursorului pe axa X si axa Y.

Cu toate aceste tool-uri la dispozitia ta se poate crea un site foarte dinamic, unic si plin de caracter. De exemplu poti face ca elemente din site sa urmareasca cursorul sau poti deforma si schimba valorile implicite ale acestor elemente.

Mai jos avem un exemplu de animatie care se foloseste de interactia mouse-ului cu un element pentru a modifica alt element:

See the Pen
Mouse Flip JS
by Puiu (@Puiu)
on CodePen.

Coordonatele mouseu-ului pot fi folosite pentru a manipula o grafica, un cursor sau un element din pagina. Poti crea o animatie de urmarire a mouse-ului sau sa influentezi elementele din pagina in functie de pozitia mouse-ului.

See the Pen
Follow mouse JS
by Puiu (@Puiu)
on CodePen.

Alegerea tipurilor de animatii trebuie sa tina cont de tipul de site si audienta ta. Dar intotdeauna exista ceva ce poti face sa dai mai multa viata site-ului tau si sa creezi o experienta de neuitat pentru vizitatori.

Mai multe articole

INOVEO a scris

BrandTalks 2.0 cu Arhip Pogurski, Fondator GURSK dupa rebranding

Cand haina de brand nu te mai reprezinta, dar ti-e mila sa o schimbi Exista un moment foarte specific in viata unui brand B2B: nu mai esti cine erai cand ai inceput, dar inca porti [...]

Read More... from Animatii JS legate de mouse

Citeste tot articolul

INOVEO a scris

Carte pentru antreprenori

Pentru oricine are aspiratii antreprenoriale sa deja e antreprenor, „The Entrepreneur Mind” de Kevin Johnson, este o lectura de luat in calcul. Este scrisa bine si ofera informatii si inspiratie; te ajuta sa te feresti [...]

Read More... from Animatii JS legate de mouse

Citeste tot articolul

INOVEO a scris

Frustrarile antreprenorilor 

Sau ce nu se spune in branding Ca agentie de branding, ne intalnim si vorbim zilnic cu multi antreprenori. Despre vise. Planuri. Si frustrari. Din discutiile noastre cu cei din piata B2B (dar nici cu [...]

Read More... from Animatii JS legate de mouse

Citeste tot articolul

INOVEO a scris

Mana si nasul in branding

Daca adevarul este imbratisarea, cum poate fi el numit fragranta? Horia-Roman Patapievici. M-am gandit mult la ideea lui Horia-Roman Patapievici care zice ca gandirea moderna (si azi cu dorinta de afirmare si cu AI-ul in [...]

Read More... from Animatii JS legate de mouse

Citeste tot articolul

INOVEO
Privacy Overview

This website uses cookies so that we can provide you with the best user experience possible. Cookie information is stored in your browser and performs functions such as recognising you when you return to our website and helping our team to understand which sections of the website you find most interesting and useful.