Learning Javascript has been a challenge for me so far. I tried following a tutorial, but the result I got wasn't what I expected based on the video. I'm wondering why that is and how I can fix it.
I'm aiming to make a box appear suddenly with text inside, and have it follow the cursor as long as it stays within a specific area (marked by LABEL- box in HTML).
Here's the code snippet:
$("#rulesInfo").mouseover(function(e) {
var hovertext = "Info for the block will come here.";
$("#hoverdiv").text(hovertext).show();
$("#hoverdiv").css("top", e.clientY+10).css("left", e.clientX+10);
}).mouseout(function() {
$("#hoverdiv").hide();
});#hoverdiv {
display: none;
position: absolute;
font-size: 12px;
background-color: #161616;
color: #fff;
border: 1px solid red;
padding: 8px;
border-radius: 5px;
}<FORM>
<DIV ID="bottom">
<P>
<INPUT TYPE="checkbox" NAME="checkedRules" VALUE="yes" REQUIRED /><LABEL FOR="checkedRules" ID="rulesInfo">I have <A HREF="#" TARGET="_blank">read the Rules and Conditions</A> for the trip.</LABEL>
</P>
</DIV>
</FORM>
<DIV ID="hoverdiv"></DIV>
<SCRIPT TYPE="text/javascript" SRC="jquery.js"></SCRIPT>
<SCRIPT TYPE="text/javascript" SRC="app.js"></SCRIPT>