2016-08-08 3 views
0

저와 함께주십시오. 나는 JavaScript로 스스로 학습하는 새로운 프로그래밍이다. 이 프로그램에서 onmouseover 이벤트와 함께 작동하는 onmouseout 이벤트에 대한 올바른 코드를 알고 싶습니다. 최종 결과는 마우스가 onMouseover와 이벤트에 대한 행동의 영역을 떠날 때 HTML 페이지에 경고 상자를 숨기 얻을 것이다 :JavaScript 코드 - onmouseout 이벤트 onmouseover 이벤트에 의해 활성화 된 경고 상자의 누계 자

<! DOCTYPE html> 
<html> 
<head> 
    <title>Product Information</title> 
    <script> 
    function Product1Info() { 
    alert("Summer Product! On sale until Labor Day for $9.99."); 
    } 
    function Product2Info() { 
    alert("One of our best sellers! A bargain at $19.50."); 
    } 
    function Product3Info() { 
    alert("Everyone could use one of these at $1.99!"); 
    } 

    </script> 
</head> 
<body> 
<h1>Fran's Place<br>Shop our inventory!</h1> 
We've got everything you need!<br> 
<img src ="product1.jpg" height="300px" width="200px" 
border="5" style="border-color:blue;" onmouseover="Product1Info()" /></div> 
<img src ="product2.jpg" height="300px" width="200px" 
border="5" style="border-color:red;" onmouseover="Product2Info()" /></div> 
<img src ="product3.jpg" height="300px" width="200px" 
border="5" style="border-color:black;" onmouseover="Product3Info()" /></div> 

</body> 
</html> 
+1

당신은 당신이 뭘 하려는지 할 수 없다 네이티브 경고 상자 - 참조 http://stackoverflow.com/questions/463368/javascript-close-alert-box –

+0

예를 들어 절대 div와 같은 'visibility : hidden'과 같은 경고를 시도 할 수 있습니다. JS가 'visibility : visible'으로 변경되고 onmouseout이 숨겨진 상태로 돌아갑니다. –

답변

0

당신은 네이티브 경고 상자 뭘 하려는지 할 수 없다 - 게시글 this 참조

div 요소 등의 알림 상자를 직접 만들거나 부트 스트랩과 같은 라이브러리 (예 : this link)를 사용하십시오. 그러면 onmouseover는이 "경고"상자를 표시하고 onmouseout은이 사용자 지정 경고 상자를 닫습니다.

사용자 지정 경고 상자가 ID = "사용자 정의 경고"가 예를 들어, onmouseout는 다음과 같이 수행하는 기능을 해고 :

document.getElementById("custom-alert").style.display = 'none'; 
+0

로저 그 CB. 귀하의 답변에 감사드립니다. 경고 상자 대신 웹 페이지의 텍스트로 정보가 onmouseover에 표시되도록 코드를 수정하는 옵션입니까? 이것이 가능하다면, 온 마우스 아웃은 효과가 있습니까? 내가하려고하는 모든 것은 마우스의 포인터가 bounderies 내에있을 때이 텍스트를 보여주고 boundery를 벗어날 때 텍스트가 사라지는 것입니다. ??? –

+0

물론, 텍스트가 표시되어야하는 곳에 div를 설정하고 텍스트에 id 속성 (예 : id = "text-div")을 지정하십시오. 그런 다음 onmouseover, (후 화살표 시작) ------> document.getElementById ("text-div"). innerHTML = "여름 제품! 노동절까지 9.99 달러에 판매하는 함수를 호출하십시오."; 다른 함수를 사용하거나 다른 함수 인자를 사용하면 onmouseout ------> document.getElementById ("text-div"). innerHTML = ""; 이것은 이것을하는 한 방법입니다. –

+0

CB와 감사합니다. –

관련 문제