728x90
728x170
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26 |
<!-- 문서 객체에 이벤트 핸들러 적용 예제 -->
<html>
...
<body>
<h1 id="title">마우스 아웃</h1>
<a href="#" id="btn"><img src="images/btn_out.gif" alt="버튼"/></a>
<p id="img_src"></p>
<script type="text/javascript">
var theBtn=document.getElementById("btn");
var s=document.getElementById("img_src");
theBtn.onmouseover=function(){
document.getElementById("title").innerHTML="마우스 오버";
theBtn.firstChild.src="images/btn_over.gif";
s.innerHTML=theBtn.firstChild.src;
}
theBtn.onmouseout=function(){
document.getElementById("title").innerHTML="마우스 아웃";
theBtn.firstChild.src="images/btn_out.gif";
s.innerHTML=theBtn.firstChild.src;
}
</script>
</body>
</html> |
cs |
소스 출처 : Do It! 자바스크립트+제이쿼리 입문 (정인용 지음, 이지스퍼블리싱)
728x90
그리드형(광고전용)
'Source Code > JavaScript' 카테고리의 다른 글
| 함수를 사용하여 사진 갤러리 만들기 (0) | 2017.05.21 |
|---|---|
| 함수 (Function) (1) | 2017.05.21 |
| 문서 객체 모델을 사용하여 자동차 견적 미리보기 페이지 만들기 (0) | 2017.05.21 |
| 폼 요소 선택자 (0) | 2017.05.21 |
| 선택자 호환성 문제 해결 (0) | 2017.05.21 |
| 문서 객체 모델 (DOM) (0) | 2017.05.21 |
| 브라우저 객체 모델을 사용해 운영체제와 스크린 정보 얻기 (0) | 2017.05.21 |
| navigator 객체 (0) | 2017.05.21 |
