[ Java Script ] 마우스 이벤트 활용하여 색 변경 하기
2022. 2. 21. 20:39ㆍJava Script
< 코드 >
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>마우스 이벤트</title>
<style type="text/css">
#box {
width: 100px;
height: 100px;
background-color: #B7A4EE;
cursor: pointer;
}
</style>
<script type="text/javascript">
function f1(obj) {
obj.style.backgroundColor = '#FF88A7';
}
function f2(obj) {
obj.style.backgroundColor = '#FFB182';
}
function f3(obj) {
obj.style.backgroundColor = "#FA8282";
}
</script>
</head>
<body>
<div id="box" onmouseover="f1(this)" onmouseout="f2(this)"
onclick="f3(this)"></div>
</body>
</html>
'Java Script' 카테고리의 다른 글
[ Java Script ] document.getElementById (0) | 2022.02.21 |
---|---|
[ Java Script ] DOM 활용하여 폼 작성하기 (0) | 2022.02.21 |
[ Java Script ] D-day 계산 프로그램 만들기 (0) | 2022.02.18 |
[ Java Script ] 숫자 업다운 게임 하기 (0) | 2022.02.18 |
[ Java Script ] 배열 활용하여 클릭하면 색 변경하기 (0) | 2022.02.18 |