Create a Custom SVG Checkbox (Animated AND Accessible!)
http://www.linode.com/designcourse - Use code 'DESIGNC19' to get $20 credit on your new Linode account!
(Codepen below) - Today, we're going to check out how to create a custom SVG checkbox that animates on click. We'll use Chromevox to ensure it's accessible as well. First, we'll hop into Adobe Illustrator (although, you can use any vector-capable software) to design the icon, then we'll define the HTML and CSS. There's a tiny bit of JavaScript as well, to toggle and reverse the animation.
Codepen demo for this project:
https://codepen.io/designcourse/pen/K...
https://codepen.io/Foxxite/pen/LYEdOoX (Improved, no JS)
Let's get started!
- - - - - - - - - - - - - - - - - - - - - -
Subscribe for NEW VIDEOS!
My site: https://designcourse.com
My personal FB account: http://fb.com/logodesigner
Coursetro FB: http://fb.com/coursetro
Coursetro's Twitter: / designcoursecom
Join my Discord! / discord
^-Chat with me and others
- - - - - - - - - - - - - - - - - - - - - -
Who is Gary Simon? Well, I'm a full stack developer with 2+ decades experience and I teach people how to design and code. I've created around 100+ courses for big brands like LinkedIn, Lynda.com, Pluralsight and Envato Network.
Now, I focus all of my time and energy on this channel and my website Coursetro.com.
Come to my discord server or add me on social media and say Hi!
En esta página del sitio puede ver el video en línea Create a Custom SVG Checkbox (Animated AND Accessible!) de Duración hora minuto segunda en buena calidad , que subió el usuario DesignCourse 09 enero 2020, comparta el enlace con amigos y conocidos, en youtube este video ya ha sido visto 37,133 veces y le gustó 1.2 mil a los espectadores. Disfruta viendo!
