(Codepen unten) - Heute schauen wir uns an, wie man eine benutzerdefinierte SVG-Checkbox erstellt, die beim Klicken animiert. Wir verwenden Chromevox, um sicherzustellen, dass sie ebenfalls barrierefrei ist. Zuerst gehen wir in Adobe Illustrator (obwohl du jede vektorfähige Software verwenden kannst), um das Symbol zu gestalten, dann definieren wir das HTML und CSS. Es gibt auch ein kleines bisschen JavaScript, um die Animation umzuschalten und umzukehren.
Codepen-Demo für dieses Projekt:
Lass uns anfangen!
- - - - - - - - - - - - - - - - - - - - - -
Abonniere für NEUE VIDEOS!
^-Chatte mit mir und anderen
- - - - - - - - - - - - - - - - - - - - - -
Wer ist Gary Simon? Nun, ich bin ein Full-Stack-Entwickler mit über 20 Jahren Erfahrung und ich bringe Menschen bei, wie man gestaltet und programmiert. Ich habe rund 100+ Kurse für große Marken wie LinkedIn, Lynda.com, Pluralsight und das Envato Network erstellt.
Jetzt konzentriere ich all meine Zeit und Energie auf diesen Kanal und meine Website Coursetro.com.
Komm zu meinem Discord-Server oder füge mich in sozialen Medien hinzu und sag Hallo!