please bear me. new , self-learning programming javascript. i'd know correct code onmouseout event works in concert onmouseover event in program. end result hide alert box on html page when mouse leaves area of action onmouseover event:
<! doctype html> <html> <head> <title>product information</title> <script> function product1info() { alert("summer product! on sale until labor day $9.99."); } function product2info() { alert("one of our best sellers! bargain @ $19.50."); } function product3info() { alert("everyone use 1 of these @ $1.99!"); } </script> </head> <body> <h1>fran's place<br>shop our inventory!</h1> we've got 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>
you can't trying native alert boxes - see this post.
either build own alert box (e.g. div elements) or use library such bootstrap (for example this link). onmouseover display "alert" box, , onmouseout close custom alert box.
for example, if custom alert box has id = "custom-alert", onmouseout fire function this:
document.getelementbyid("custom-alert").style.display = 'none'; 
Comments
Post a Comment