Javascript Function Onhover In

I have got this code in HTML:

<div id="choice" onHover="npcRoll()">
    <p>Choose your weapon!</p>
    <button id="rock" onClick="choose(1)">Rock</button>
    <button id="paper" onClick="choose(2)">Paper</button>
    <button id="scissors" onClick="choose(3)">Scissors</button>
    <p>You chose <span id="userChoice"></span>!</p>
</div>

And here is my JavaScript code for it:

// Random
var random = function(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
};  

// NPC
var npc;
function npcRoll(){
    npc = random(1, 3);
}

And here is the CSS code:

#choice {
    margin: 0 auto;
    border: 2px solid gray;
    width: 350px;
}

The idea was to make roll NPC number every time the user hovers over the <div> but it doesn't work. Can you help me with it?

1 Answer

There is no onHover event, use onmouseover:

<div id="choice" onmouseover="npcRoll()">
1

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Alexander Ross

Alexander Ross

Gaming, Esports & Interactive Media Writer

Alexander Ross has covered the video game industry for a decade, writing deep dives on game design, esports tournaments, VR developments, and gaming culture.

Share this article
Twitter Facebook Pinterest