그림 마우스오버시 테두리생김

Html & Css

그림 마우스오버시 테두리생김

안개핑 2016. 6. 4. 01:50

1. <head><head>사이에 넣어주세요.

< style>
.borderimage{
border:3px solid white;
}
< /style>
< script language="JavaScript1.2">
function borderit(which,color){
//if IE 4+ or NS 6+
if (document.all||document.getElementById){
which.style.borderColor=color
}
}
< /script>

※ 3px 는 테두리 두께입니다.

2. <body>와 </body> 그림 넣을위치에
<img src="1.jpg" class="borderimage" onMouseover="borderit(this,'black')" onMouseout="borderit(this,'white')">

※ black 는 마우스 올렸을때 색상입니다.
※ white 는 마우스 내렸을때 색상입니다.

링크와 함께 연결 하실때는 아래처럼...

< a href=연결주소><img src="1.jpg" class="borderimage" onMouseover="borderit(this,'black')" onMouseout="borderit(this,'white')"></a>

저작자표시 비영리 변경금지