Is there a way for a pop-up to appear when all divs got 'onmouseovered'?
function moveOver(obj)
{
obj.innerHTML = "POP!!!"
obj.style.color = "#ff0000"
obj.style.background = "transparent"
if ()
{
alert("There is no circles left!")
}
}
I basically have 12 circles that pop when you move your mouse over them, is there a way to make a pop-up that says "There is no circles left!" after I hover over the 12th circle?
Add a class to the element
obj.classList.add("popped");
and check the length
if (document.querySelectorAll(".popped").length === 12) {
You'll need to store the fact that each one gets the mouse over event. You could give each circle a unique class, and then on the mouse over even, you could add a class to mark it. Then you just check to see if there are none left that aren't marked.
function moveOver(e) {
let circle = e.target;
circle.innerHTML = "POP!!!";
circle.classList.add('popped');
if (!document.querySelectorAll('.circleClass:NOT(.popped)').length) {
alert("There is no circles left!");
}
}
.popped {
circle.style.color = "#ff0000";
circle.style.background = "transparent";
}