묻고답하기
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
이게 왜 안되는건지 -_-;
2002.03.13 19:20
<html>
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<style type="text/css">
td {font-size:9pt;color:white}
.menu {background-color:#996633;}
.over {background-color:#336699;}
</style>
</head>
<body>
<table width=400 border=0 cellspacing=0 cellpadding=0>
<tr>
<td bgcolor=#000000>
<table width=400 cellspacing=1 cellpadding=5>
<tr align=center>
<td class="menu" onMouseOver="this.ClassName='over'" onMouseOut="this.ClassName='menu'">
Home
</td>
<td class="menu" onMouseOver="this.ClassName='over'" onMouseOut="this.ClassName='menu'">
Profile
</td>
<td class="menu" onMouseOver="this.ClassName='over'" onMouseOut="this.ClassName='menu'">
Works
</td>
<td class="menu" onMouseOver="this.ClassName='over'" onMouseOut="this.ClassName='menu'">
Contact us
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
에휴..답답하네요
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<style type="text/css">
td {font-size:9pt;color:white}
.menu {background-color:#996633;}
.over {background-color:#336699;}
</style>
</head>
<body>
<table width=400 border=0 cellspacing=0 cellpadding=0>
<tr>
<td bgcolor=#000000>
<table width=400 cellspacing=1 cellpadding=5>
<tr align=center>
<td class="menu" onMouseOver="this.ClassName='over'" onMouseOut="this.ClassName='menu'">
Home
</td>
<td class="menu" onMouseOver="this.ClassName='over'" onMouseOut="this.ClassName='menu'">
Profile
</td>
<td class="menu" onMouseOver="this.ClassName='over'" onMouseOut="this.ClassName='menu'">
Works
</td>
<td class="menu" onMouseOver="this.ClassName='over'" onMouseOut="this.ClassName='menu'">
Contact us
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
에휴..답답하네요
댓글 3
-
Legend
2002.03.13 22:05
-
Legend
2002.03.13 22:02
class이름 속성은 첫글자가 대문자가 아닙니다..
ClassName이 아니라 className으로 하셔야 하죠..
tag명 속성도 마찬가지죠.. tagName형태로 사용하죠.. -
Legend
2002.03.13 22:18
방법을 알려드리면 아래와 같이 고침니다.
<html>
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<style type="text/css">
td {font-size:9pt;color:white}
.menu {background-color:#996633; behavior: url("over.htc");
</style>
</head>
<body>
<table width=400 border=0 cellspacing=0 cellpadding=0>
<tr>
<td bgcolor=#000000>
<table width=400 cellspacing=1 cellpadding=5>
<tr align=center>
<td class="menu">
Home
</td>
<td class="menu">
Profile
</td>
<td class="menu">
Works
</td>
<td class="menu">
Contact us
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
over.htc파일을 만듭니다. 아래와 같이 코드를 넣습니다.
<PUBLIC:ATTACH EVENT="onmouseover" ONEVENT="mouseover()" />
<PUBLIC:ATTACH EVENT="onmouseout" ONEVENT="mouseout()" />
<SCRIPT LANGUAGE="JScript">
function mouseover(){window.event.srcElement.style.background="#336699"}
function mouseout(){window.event.srcElement.style.background="#996633"}
</SCRIPT>
위와 같이 하면 원하시는 마우스 오버 효과를 위와 같이 이벤트 핸들러를 일일이 줄 필요없이 클래스명을 menu로 주기만 하면 같은 효과를 나타낼 수 있습니다.
이벤트 핸들러를 매번 쓰지않고 클래스 명만으로 위와 같이 하는 방법이 가능하니까요..