버튼의 디스플레이 스타일을 변경하면 동적 버튼 스 와이프가 달성됩니다.
코드 사본은 다음과 같습니다.
<! doctype html public "-// w3c // dtd xhtml 1.0 Transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">
<헤드>
<meta http-equiv = "content-type"content = "text /html; charset = utf-8" />
<title> 제목의 문서 </title>
</head>
<스타일>
.Search {배경 :#008800; 색상 : #fff; 국경 : 없음; 높이 : 26px; 라인 높이 : 20px; 너비 : 63x;}
.searchhover {배경 :#000099; 색상 : #fff; 국경 : 없음; 높이 : 26px; 라인 높이 : 20px; 너비 : 63px; }
</스타일>
</head>
<body onload = "js ()">
<입력 유형 = "button"id = "btn"name = "btn"value = "login"/>
<입력 유형 = "버튼"id = "btn2"name = "btn"value = "logout"/>
<script type = "text/javaScript">
함수 js ()
{
// IE6 버튼 지원 호버 속성 OBJ, Hover를 지원하려는 엔터티는 BTN : Hover의 스타일입니다. 초기 스타일입니다.
obj = "btn";
Alert (Navigator.AppName);
if (navigator.appname == "Microsoft Internet Explorer"&& parsefloat (navigator.appversion) == 4) {// judial IE6
var o = document.getElementsByName (OBJ);
for (var i = 0; i <o.length; i ++) {
if (o [i] .type == "버튼") {
//o]. ClassName = "검색";
o [i] .onmouseover = function () {this.className = "SearchHover"}
o [i] .onmouseout = function () {this.className = "검색"};
}
}
}
}
</스크립트>
</body>
</html>