1.아래 소스를 <head></head>사이에 넣어 줍니다.
<script language="JavaScript">
function bt(id,after){
eval(id+'.filters.blendTrans.stop();');
eval(id+'.filters.blendTrans.Apply();');
eval(id+'.src="'+after+'";');
eval(id+'.filters.blendTrans.Play();');
}
</script>
2.아래소스를 <body></body>사이에 넣어 줍니다.
<a href=http://webzigi3.com onfocus='this.blur()' onMouseOver='bt("menu1","a.jpg")' onMouseOut='bt("menu1","a1.jpg")'><img ID=menu1 src=a1.jpg border=0 style="filter:blendTrans(duration=0.5)"></a>
<a href=http://www.naver.com onfocus='this.blur()' onMouseOver='bt("menu2","b.jpg")' onMouseOut='bt("menu2","b1.jpg")'><img ID=menu2 src=b1.jpg border=0 style="filter:blendTrans(duration=0.5)"></a>
<a href=http://www.daum.net onfocus='this.blur()' onMouseOver='bt("menu3","c.jpg")' onMouseOut='bt("menu3","c1.jpg")'><img ID=menu3 src=c1.jpg border=0 style="filter:blendTrans(duration=0.5)"></a>
<a href=http://www.google.com onfocus='this.blur()' onMouseOver='bt("menu4","d.jpg")' onMouseOut='bt("menu4","d1.jpg")'><img ID=menu4 src=d1.jpg border=0 style="filter:blendTrans(duration=0.5)"></a>
3.설정해야할 부분
ID, 마우스를 올릴때 이미지, 마우스를 떼었을때 이미지를 바꾸어 줍니다. 'duration'값은 이미지가 변환되는 속도를 설정합니다. 값을 많이 줄수록 변환속도가 빨라집니다.
'HTML/CSS/SCRIPT' 카테고리의 다른 글
| 저작권 작성방법 (0) | 2007.04.19 |
|---|---|
| 링크된문장 상황에따라 스타일 적용하기(밑줄,색깔) (0) | 2007.04.19 |
| 문장의 줄간격 설정하기 [line-height] (0) | 2007.04.19 |
| 외부스타일 링크해서 사용하기 (0) | 2007.04.19 |
| 링크자국없애기 (0) | 2007.04.19 |
Comments