ie6下hover实现

最新推荐文章于 2022-06-20 15:23:12 发布

最新推荐文章于 2022-06-20 15:23:12 发布 · 154 阅读

文章标签：

#CSS #Microsoft #HTML

javascript 专栏收录该内容

6 篇文章

订阅专栏

ie6下，<a>的hover效果用css就可以实现了，不多说了。
说下button:hover的实现（css好像不行吧），写了段js。


<html>
<head>
<style>
.btn { color:#000;  border:0; cursor:hand;}
.btn_hover { color:#3E3E3E; }

</style>
</head>
<body>
   <input type="button" class="btn"  value="登 录"/>
   <script type="text/javascript" >
	addLoadEvent(elementHover("input","btn_hover","btn"));
   </script>
</body>
</html>


/**
 * @author tiger
 * 2009-5-21
 */
function addLoadEvent(func) { 
   var oldonload = window.onload; 
   if (typeof window.onload != 'function') { 
        window.onload = func; 
       } else { 
        window.onload = function() { 
          if (oldonload) { 
              oldonload(); 
             } 
        func(); 
       } 
    } 
} 
 function elementHover(obj,hover,init){// 使ie6 button支持hover属性 obj是要支持hover的实体  hover是btn:hover的样式，init是初始样式
 	if(navigator.appName == "Microsoft Internet Explorer" && parseFloat(navigator.appVersion) == 4){// 判断ie6
		var o = document.getElementsByTagName(obj);
		for(var i=0;i<o.length;i++){
			if(o[i].type == "button" || obj != "input"){
				o[i].className = init;
				o[i].onmouseover = function(){ this.className = hover}
				o[i].onmouseout  = function(){ this.className = init};
			}
		}
	}
 }