How To Change CSS Values With A Slider! - CSS Custom Properties (Variables) & JavaScript

Download the PDF front-end roadmap for FREE to keep you on track!
https://courses.codestackr.com/front-end-web-developer-roadmap-2020

In this video, we will change the border radius of a square using a slider. We can easily accomplish this by using CSS custom properties (CSS variables) and a bit of JavaScript.

CodePen: https://codepen.io/codeSTACKr/pen/MWKJzWe
_____________________________________

📚 Learn to CODE in just a FEW months here:
Treehouse Discount Code: https://treehouse.7eer.net/codeSTACKr
_____________________________________

🛠️ Tools I use:
🟠 Theme: https://marketplace.visualstudio.com/items?itemName=codestackr.codestackr-theme
🟠 Font: STACKr Code (Exclusive to my VS Code Course - https://vsCodeHero.com)
🟠 SuperHero Extension Pack: https://marketplace.visualstudio.com/items?itemName=codeSTACKr.superhero-extensions

🚢 Deploy for FREE on Vercel: https://vercel.com/ambassadors/codestackr
_____________________________________

💖 Show support!
PayPal: https://paypal.me/codeSTACKr
_____________________________________

Watch Next:
Web Development - Beginners Roadmap (2020) - https://youtu.be/iogabydg2y0
Playlist: Web Development For Beginners - https://www.youtube.com/watch?v=Ez4yHS2dsN8&list=PLkwxH9e_vrAJ0WbEsFA9W3I1W-g_BTsbt
_____________________________________

Connect With Me:
Website: http://www.codestackr.com
Twitter: https://twitter.com/codeSTACKr
Instagram: https://instagram.com/codeSTACKr/
Facebook: https://facebook.com/codeSTACKr
_____________________________________

** Affiliate Disclaimer: Some of the above links may be affiliate links, which may generate me a sales commission at no additional cost to you.

#codeSTACKr #css #javascript

Тэги:

#css_custom_properties #css_tutorial #javascript_css_custom_properties #css_custom_properties_javascript #css_javascript #javascript_css #javascript_css_values #javascript_border_radius #javascript_slider #javascript_slider_tutorial #javascript_tutorial #css_variables #css_variable #javascript_css_variable #css_variables_javascript #change_css_with_javascript #change_css_variable_with_javascript #change_css_custom_property_with_javascript #css_custom_property

Скачать видео