Event listener in javascript

[@HiteshCodeLab]

Full course is FREE and will be available here
courses.learncodeonline.in/learn/Complete-Javascript-course

[@manasraikaushik864]

We dont have access to any of the attachments you provided, what is the need to keep video free ? just do it paid too ...

[@saibhanumathurthi903]

Hitesh sir, I'm a fan of the way you teaches everything✋

[@dinesh0743]

Best javascript series ever.., on UA-cam.

[@aarushgoyal]

Signs that you have become a Pro UA-camr :
You start finding innovative methods for Subscribe Appeal

[@afamsval]

Thank you so much for this video. I am really enjoying the quality of the video .

[@techiesrikanth2447]

Thanks for Amazing course Hitesh !!

[@rajkumarv.b565]

Here's my version of the logic :
const red = document.querySelector(".red")
const cyan = document.querySelector(".cyan")
const violet = document.querySelector(".violet")
const orange = document.querySelector(".orange")
const pink = document.querySelector(".pink")
const center = document.querySelector(".center")
const getElementBGColor = (Element) => {
return window.getComputedStyle(Element).backgroundColor
}
const magicColorChanger = (element) => {
element.addEventListener("mouseenter",() => {
center.style.background = getElementBGColor(element)
})
}
magicColorChanger(red)
magicColorChanger(cyan)
magicColorChanger(violet)
magicColorChanger(orange)
magicColorChanger(pink)
magicColorChanger(center)

[@gauravnag9046]

Hi SIr,
Thank you for explaining concept.
But please clarify if there are 10 colors, then we need to write magicColorChanger() 10 times. Instead of it can we pick the colors dynamically with less number of code lines. If yes, pls guide on that

[@gunvantchandratre8333]

Really Nice Video Sir 👌

[@redemption4836]

What exactly does the element in magiccolorchanger does if the color part grabs the actual color?

[@monusingh3719]

Sir you told to always use return while using curly braces in arrow and callbacks so here at 6:05 at line 17 you are not using return keyword......pls tell

[@meetsakhareliya755]

In function we do not always return. Whenever there is case in which function returns something , if we put braces we have to write return. if there is nothing to return , no need to write return weather it is a simple function or arrow function. I hope you understand my point

[@soumeshk]

Which VS Code theme do you use?

[@vivekhridayanandverma854]

Hitesh sir doing good with your current running course with js thanks for this.
In this project I am getting type error like failed to execute getComputedStyle on Windows...parameter 1 is not type of element #error
I used setBGColor but i am able garb first only rest of not able to grab...please suggest about error

[@bobcoderz]

Hey Sir can you share how you configure vscode :)

[@aarushgoyal]

@Unique Rohit Patil I guess he is talking about the custom color scheme of Hitesh sir

[@sivasai6890]

Thanks a lot sir for free course

[@manojkumarm8398]

hearty thanks fr this

[@Ravi-oh8xz]

Enjoyed the project ❤️❤️

[@ankushladani496]

Thank you sir...

[@robot67799]

Amazing

[@sreeramp6688]

Nice nd Easy!!

[@milankbudha]

plz provide source code also..It will be more easy for us to copy in our text editor directly rather than making a note in a copy .It will save our time..Thank you

[@JoyKimaiyo]

Hi, Hitesh I cannot access your website. Is it location wise or just the website cannot be accessed for everyone?

[@somitdas7740]

Hi!
@hitesh sir
As i can see this playlist contains videos till the number 37 and further from 38 its private. WHhy is that so?

[@aarushgoyal]

he has made the entire playlist but is releasing one video a day

[@vraj3115]

#10minutesJS day 35! and not sleepy anymore !!

[@darkalpha6530]

Sir can we use the CSS property ":hover" to make it do all the things you told in this video?

[@rellaraffick]

Technically, yes we can. As we can see Tooltips on hover, Popups on hover works that way too. Sir has performed like in the video just for an example. That's a great question mate ! Keep it up & All the best

[@rajeshveeranki3517]

HI this is CSS content.!!
body {
background: rgb(66, 66, 66);
min-height: 100vh;
display: flex;
justify-content: center;
align-items: center;
position: relative;
}
.red {
background: #e44236;
margin-right: 5px;
}
.cyan {
background: #25ccf7;
margin-right: 5px;
}
.violet {
background: #8b78e6;
margin-right: 5px;
}
.orange {
background: #ea7773;
margin-right: 5px;
}
.pink {
background: #bb2cd9;
}

.center {
min-width: 400px;
height: 400px;
background: rgb(66, 66, 66);
border-radius: 100%;
transition: 0.2s ease-in-out all;
}
.color-hover {
position: absolute;
top: 10%;
bottom: 0;
left: 50%;
transform: translateX(-50%);
padding: 10px;
display: flex;
justify-content: center;
flex-direction: row;
}
.text {
padding: 10px;
color: #ffffff;
}
.color {
width: 120px;
height: 30px;
border-radius: 5%;
margin-bottom: 30px;
}
.color:hover {
cursor: pointer;
}
.color:last-child {
margin-bottom: 0;
}

[@KidusYosef-x5n]

Thanks

[@harmanpreetkaur3076]

thanks🙂

[@vijaynavale3919]

Keep going 👍

[@anbazhagan6826]

This is... This is .. awesome.😍

[@ajaypathak2214]

Why getComputedStyle not working with getElementsBy---. ?

[@willowayya]

Dear sir with only one programming language can be job get or not ? I m on JavaScript

[@NIDHISHARMA-ep6nc]

Tysm sir

[@tusharvashisht5]

day 3 still stuck on this

[@wasimrajamiddya7560]

Sir will I get certificate after completing this course?

[@085-vaibhavgusain9]

same funtionality
const colorName = [".red",".cyan",".violet",".orange",".pink"]
colorName.forEach((item) => {
document.querySelector(item).addEventListener("mouseenter",() =>{
document.querySelector(".center").style.backgroundColor = window.getComputedStyle(document.querySelector(item)).backgroundColor;})
});

[@unboxinggadgets4105]

they not show me same color, they show black color why?

[@manyasingh7112]

Love u pajji

[@sufism48]

from where i can get this code file?

[@kunalahuja4307]

Something on Post messages please!

[@unboxinggadgets4105]

sir plz show your div center css properties

[@sudarshanjha6737]

Make body flex and add align item and justify content center ..
Fir normal .center{
Height : 5rem;
Width : 5rem
Border-radius: 50%}

[@VikramSingh-qg3nh]

this was the 1st one i was unable to get output :( can you help me

[@VikramSingh-qg3nh]

resolved

[@AgarwalAnup95]

First

[@Mrvijay-z7k]

plz turn of add's

[@rajeshbagguva3005]

second

[@gurdeepsinghjohar1761]

Bro i need core java tutorial.🙂

[@udittyagi9238]

Third

[@abhichi]

Mr beast and u look so much similar 🤔😂

[@riteshpuley2891]

Amazing