이 코드에서 작동하지 않습니다.

Question

자바 스크립트를 배우기 시작했는데 꽤 어려웠습니다. 그러나 나는 그의 비디오에서 말한 것처럼 하나의 튜토리얼을 따라 갔지만 여전히 나의 결과는 내가 기대했던 것이 아니고 그가 비디오에서 얻은 것이 아니다. 나는 왜 그런지, 어떻게 고칠 수 있는지 궁금합니다.

상자에 텍스트가 표시되지 않도록하고 표시된 영토 내에있는 한 커서를 따라 가야합니다 (LABEL - 상자의 HTML).

여기에 코드입니다 :

$("#rulesInfo").mouseover(function(e) { 
 
\t var hovertext = "Info for the block will come here."; 
 
\t $("#hoverdiv").text(hovertext).show(); 
 
\t $("#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> 
 
\t <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> 
 
\t </P> 
 
    </DIV> 
 
</FORM> 
 

 
<DIV ID="hoverdiv"></DIV> 
 

 
<SCRIPT TYPE="text/javascript" SRC="jquery.js"></SCRIPT> 
 
<SCRIPT TYPE="text/javascript" SRC="app.js"></SCRIPT>

Answer 1

당신이 할 싶은 것은 사용자가 개체의 모든 마우스 이동에 터집니다 MouseMove 이벤트 이벤트입니다. mouseover 마우스가 처음으로 개체 위로 이동할 때만 발생합니다.

는 여기를 참조하십시오

$("#rulesInfo").mousemove(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(); 

});

http://jsfiddle.net/mzwj26a7/