onmouseover和onmouseout鼠標移入移出時觸發的事件:
onmouseover 用戶鼠標移入元素時觸發的事件。並執行onmouseover調用的函數。
onmouseout 用戶鼠標移開元素時觸發的事件。並執行onmouseout調用的函數。
onmouseover和onmouseout 這兩個事件在javascript中較常用。
下面通過壹個示例更深入了解這兩個事件的使用:
示例:鼠標移入時,改變字體的背景色,移出時,還原默認的背景色。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>鼠標移入時,改變字體的背景色,移出時,還原默認的背景色。</title>
<style>
.xuexi{width:200px;height:120px;background:#abcdef;border:1px solid green;}
</style>
<script>
function aixuexi(){
var woaixuexi=document.getElementById("woaixuexi");
woaixuexi.style.background="yellowgreen";
}
function xuexi(){
var xuexi=document.getElementById("woaixuexi");
xuexi.style.background="#abcdef";
}
</script>
</head>
<body>
<div id="woaixuexi" onmouseover="aixuexi();" onmouseout="xuexi();" class="xuexi"></div>
</body>
</html>