<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
<style>
input {
width: 200px;
background-color: gray;
}
</style>
</head>
<body>
<table align="center">
<tr>
<td><input type="button" value="첫번째버튼"
onmouseover="yellowBtn(this)" onmouseout="grayBtn(this)"></td>
</tr>
</table>
</br>
</br>
</br>
<table align="center">
<tr>
<td><input type="button" value="두번째버튼"
onmouseover="redBtn(this)" onmouseout="grayBtn(this)"></td>
</tr>
</table>
<script type="text/javascript">
function yellowBtn(e) {
e.style.background = "yellow";
}
function redBtn(e) {
e.style.background = "red";
}
function grayBtn(e) {
e.style.background = "gray";
}
</script>
</body>
</html>
'JAVA > 자바스크립트' 카테고리의 다른 글
자바스크립트 Document 객체를이용한 (0) | 2014.10.03 |
---|---|
자바스크립트 소문자 -> 대문자 바꾸기 예제 (0) | 2014.10.03 |
자바스크립트 이벤트객체예제(버튼을이용해 이미지전환) (0) | 2014.10.03 |
자바스크립트 이벤트 잡기 (0) | 2014.10.02 |
자바스크립트 텍스트필드 빈칸체크예제 (0) | 2014.09.28 |