Simple Dropdown with Js, HTML and CSS | Javascript for Beginners

Publicado el: 19 julio 2021
en el canal de: Red Eye Media
57
5

In this tutorial we will look at how to make a dropdown using just Javascript, HTML and CSS in just about 15 minutes without any complicated code or frameworks. This is a simple, but useful little project that you will most likely see again in some form as you develop your apps.

We will use our Javascript to toggle between two different classes when we click an element on the page. In this way we can have one style for when the dropdown is visible and one for when its hidden.
To do this we create a click event listener and make use of classList.toggle() which makes it easy to change between our two different styles.

Timecodes
0:00​ - Intro
0:24 - making files
0:045 - html
04:50 - css
12:19 - javascript

Complete code on Github:
https://github.com/Polkagris/dropdown...

How to get the code without using the terminal:
1. Go to the Github link
2. Click on the green Code-button
3. Click Download ZIP
4. Extract and open the folder in your preferred code editor (I'm using visual studio code, download link below)
5. To see the game in action, just open the index.html file in you browser

Code editor download link:
https://code.visualstudio.com/


En esta página del sitio puede ver el video en línea Simple Dropdown with Js, HTML and CSS | Javascript for Beginners de Duración hora minuto segunda en buena calidad , que subió el usuario Red Eye Media 19 julio 2021, comparta el enlace con amigos y conocidos, en youtube este video ya ha sido visto 57 veces y le gustó 5 a los espectadores. Disfruta viendo!