The aim of this exercise is to let you use your DOM events ('click', 'change') understanding to do some DOM manipulation.
Remember to always use console.log
to understand how things work.
-
Add the necessary code to change the color of
#pallete
div Randomly:- Clicking
choose random color
should choose a random color fromcolors
array injs/index.js
and apply it to the#pallete
background-color.
look for how to manipulate the style of a DOM element.
this may help with the getting the random index.
- Clicking
-
Add the necessary code to change the color of
#pallete
div based on the#color
input value:- When the user type
a hexa color code
inside#color
input, should apply the color to the#pallete
background-color.
look for
change
orinput
event and how it's used and choose what suits you best, also remember to find a way to get the value that the user type inside theinput
,console.log(event.target);
may help you. - When the user type
-
Extra:
- Also apply the color to the input font when the use type a hexa color isnide the
input
. - Insert the random hexa color code inside the
input
programaticly when the user click onchoose random color
.
- Also apply the color to the input font when the use type a hexa color isnide the
Please, do not hisitate to ask/help others. Me and Hashem are always online to provide the suport.
And Have fun please.