JavaScript OnMouseOver คือเหตุการณ์ที่เกิดจากการนำเมาส์เข้าสู่เขตพื้นที่ควบคุม
ตัวอย่างนี้จะเป็นการใช้ JavaScript OnMouseOver คือเมื่อนำเมาส์เข้าสู่เขตพื้นที่ที่ได้ทำการควบคุมไว้
Syntax
<element OnMouseOver = "JavaScript:[handler/function]">
HTML Tag element ที่สามารถใส่ Event OnMouseOver
<a>, <address>, <area>, <b>, <bdo>, <big>, <blockquote>, <body>, <button>, <caption>, <cite>, <code>, <dd>, <dfn>,
<div>, <dl>, <dt>, <em>, <fieldset>, <form>, <h1> to <h6>, <hr>, <i>, <img>, <input>, <kbd>, <label>, <legend>, <li>,
<map>, <object>, <ol>, <p>, <pre>, <samp>, <select>, <small>, <span>, <strong>, <sub>, <sup>, <table>, <tbody>, <td>,
<textarea>, <tfoot>, <th>, <thead>, <tr>, <tt>, <ul>, <var>,button, document, checkbox, link, radio, reset, submit
Sample
<html>
<head>
<title>ThaiCreate.Com Tutorial</title>
</head>
<body>
<script language="javascript">
function fncAlert()
{
alert('Hello ThaiCreate.Com');
}
</script>
<form action="page.cgi" method="post" name="form1">
<input name="btnButton1" type="button" value="Hello" OnMouseOver="JavaScript:fncAlert();">
<br>
<br>
<table width="142" border="1" OnMouseOver="JavaScript:fncAlert();">
<tr>
<td><div align="center">Hello</div></td>
</tr>
</table>
<br>
<br>
<span OnMouseOver="JavaScript:fncAlert();">Hello</span>
<br>
<br>
<input name="btnButton2" type="button" value="Hello & Hide" OnMouseOver="JavaScript:fncAlert();this.style.display='none';">
<br>
<br>
<table width="142" border="1" OnMouseOver="JavaScript:fncAlert();this.bgColor='#0000FF'" style="cursor:hand">
<tr>
<td><div align="center">Hello & Bg Color</div></td>
</tr>
</table>
</form>
</body>
</html>