CODEWITHSUNDEEP
javascriptcsshover
Aristov
Aristov

Reputation: 33

Changing backgroundColor after hover in javascript

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>

Upvotes: 2

Views: 5029

Answers (1)

Eran Shabi
Eran Shabi

Reputation: 14979

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;
}

Upvotes: 2

Related Questions