3층 1구역 - 개발의 장/JSP
JSP - JavaScript mousedown, mouseup (2022-09-16)
상이태상
2022. 9. 18. 22:07
1. 서론
이번엔 mousedown, mouseup의 대한 이벤트이다.
mousedown은 마우스를 누르고 있을 때 바뀌는 이벤트이다.
mouseup은 반대로 마우스를 뗐을 때 바뀌는 이벤트 이다.
예제를 통해 알아보도록 하자.
2. 본론
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ex21</title>
<script type="text/javascript">
function mouse_down(obj){
obj.innerHTML = "마우스 버튼을 누르고 있어요.";
}
function mouse_up(obj) {
obj.innerHTML = "마우스 버튼을 누르고 있지 않아요";
}
</script>
</head>
<body>
<div onmousedown="mouse_down(this)" onmouseup="mouse_up(this)">마우스를 꾸욱 눌러보세요!</div>
</body>
</html>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ex22</title>
<script type="text/javascript">
function mouse_down(obj){
obj.src = "/jsExam/images/images/lighton.png";
}
function mouse_up(obj) {
obj.src = "/jsExam/images/images/lightoff.png";
}
</script>
</head>
<body>
<img src="/jsExam/images/images/lightoff.png" onmousedown="mouse_down(this)" onmouseup="mouse_up(this)" width="281px" height="495px">
<br> Click mouse and hold down!
</body>
</html>