# 123: Dacă se deplasează când faceți clic, faceți ceva lipit - CSS-Tricks

Anonim

Butoanele de pe CSS-Tricks, la momentul acestui videoclip, au un efect 3D fals. Arată ca o cărămidă albastră la care te uiți de sus într-un unghi. Când apăsați pe ele, starea lor activă este declanșată (la fel ca toate legăturile / butoanele / intrările) și CSS le mută în jos și în dreapta, apărând ca și cum ați fi apăsat literalmente cărămida în suprafață un pic.

Care este problema? Când mutați un astfel de element (în acest caz, transformați translate(3px, 3px);:) schimbați zona în care apăsarea respectivă va declanșa evenimentul „click” DOM. Dacă locația acelei apăsări se află într-o zonă care este acum supradimensionată din acea zonă „clicabilă”, aceasta nu se va declanșa. Deci butonul pare apăsat, dar niciodată nu devine apăsat. E un comportament ciudat, rău și neașteptat.

Efectul este încă răcoros, așa că în acest videoclip îl remediem mutând un pseudoelement pentru a umple spațiul lăsat în urmă, făcând zona „clicabilă” întotdeauna aceeași.

Vezi demo Pen.