猿问

IE中不兼容,求解原因

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
	<title>hello world!</title>
	<style type="text/css">
	#oli {
		width: 200px;
		height: 200px;
		background-color: blue;
		border: 5px solid red;
		list-style: none;
	}
	</style>
	<script src="./js/script.js"></script>
	<script type="text/javascript">
		window.onload = function() {
			var oli = document.getElementById('oli');
			oli.onmouseover = function(){
				startMove(oli,{"height":250,"opacity":50});
			}
		}
	</script>
</head>
<body>
<ul>	
<li id="oli"></li>
</ul>
</body>
</html>

以上是HTML部分

下面是JavaScript代码

				function startMove(obj,json,fn){
					clearInterval(obj.timer);
					obj.timer = setInterval(function(){
						var all = true;//假设全部执行成功
						for(var attr in json){
							var icur = 0;
							if(attr == "opacity"){
								icur = Math.round(parseFloat(getStyle(obj,attr)) * 100);
							}else{
								icur = parseInt(getStyle(obj,attr));
							}
							var speed = (json[attr] - icur)/10;
							speed = speed>0?Math.ceil(speed):Math.floor(speed);
							if(icur != json[attr]){
								all = false;
							}
							//判断是否为透明度
							if(attr == "opacity"){
									obj.style.filter='alpha(opacity='+(icur+speed)+')';
									obj.style.opacity=(icur+speed)/100;
								}else{
									obj.style[attr] = icur + speed + "px";
									}   
							//检测停止
							if(all){
								clearInterval(obj.timer);
								if(fn){
									fn();
								}
							}
						}
					},30);  
				}
			//解决IE兼容
			function getStyle(obj,attr) {
				return obj.currentStyle ? obj.currentStyle[attr]:getComputedStyle(obj)[attr];
			}

透明度在IE7、8当中测试时没有变化,自己找了很长时间没有找到原因,兼容代码应该是对的,那么应该是判断透明度那段JS出了问题吧,求解,感谢~

一二得三
浏览 1510回答 3
3回答

stone310

没有初始值,obj.currentStyle.opacity获取不到;在css上加上初始值即可opacity:1; filter:alpha(opacity=100);

路人丶丨

考虑兼容问题的话,可以引入pie.js。 
随时随地看视频慕课网APP

相关分类

JavaScript
我要回答