Changing backgroundColor after hover in javascript

Question

I need to change hover backgroundColor in Javascript

function changeColor(color) {
var block = document.getElementsByClassName('kafelek');
for (var i = 0; i < block.length; i++) {
    block[i].style.backgroundColor = "#" + color;
}};

In this code, I change color of block after click, but i need to change color of block after hover too.

<div class="kolorek" onclick="changeColor('2ecc71');" style="background-color:#2ecc71;"></div>

This code just changes the background color. When this code runs is related to how you attach this to the event. Show us the code you use to bind this to the event of some element. In general for hover check out the mouseover and mouseout events — Gabriele Petrioli
– Gabriele Petrioli, Commented Dec 23, 2016 at 16:14
In addition to the above comments, are you aware that background-color can be changed on hover with CSS and no JavaScript? — Jon Uleis
– Jon Uleis, Commented Dec 23, 2016 at 16:15
I have paletee of colors, and while im clicking one of them all blocks in other class are changing colors. — Aristov
– Aristov, Commented Dec 23, 2016 at 16:26

Eran Shabi · Accepted Answer · 2016-12-23 16:16:01Z

2

Maybe try the mouseleave event:

element.addEventListener("mouseleave", function( event ) {   
    event.target.style.backgroundColor = "purple";
}

Also if you want it to change only when the mouse is on the element, you better use css :hover, like so:

element:hover {
    background-color: #yourcolor;
}

answered Dec 23, 2016 at 16:16

Eran Shabi

15.2k8 gold badges33 silver badges51 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Aristov Over a year ago

But i need to dynamic change this color, so i have to use javascript

Collectives™ on Stack Overflow

Changing backgroundColor after hover in javascript

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related