소스
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta name="generator" content="editplus" />
<meta name="author" content="김종현" />
<style type="text/css">
div {
border:1px solid black;
width:300px; height:300px;
background-color:#c7cffc;
}
</style>
<script type="text/javascript">
function Test1(d) {
//마우스키 들어왔을때
d.innerText = "마우스가 들어왔습니다.";
}
function Test2(d) {
//마우스가 나갔을때
d.innerText = "마우스가 나갔습니다.";
}
function Test3(d) {
//마우스가 이동할때
//d.innerText = "마우스가 이동중입니다.";
//d.innerText = "마우스가 현재 (" + event.x + "," + event.y + ")에 있습니다.";
}
function Test4(d) {
//마우스 버튼이 눌려질때 왼쪽, 오른쪽 상관없음
d.innerText = "좌표:" + event.x + "," + event.y + " / 버튼 : " + event.button;
}
</script>
</head>
<body>
<div id="div1" onmouseover="Test1(this);" onmouseout="Test2(this);" onmousemove="Test3(this);" onmousedown="Test4(this)">
</div>
</body>
</html>
결과