同一套代碼,寬高可以改變,透明度為什么就沒(méi)法改變了
為什么我的設(shè)透明度沒(méi)法正常運(yùn)行,而運(yùn)行寬高時(shí)都正常,大神們給我看下透明度這塊哪里有誤
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>
</title>
<style type="text/css">
? ? ? ?#test{
? ? ? ? height: 200px;
? ? ? ? width: 200px;
? ? ? ? border: 2px solid red;
? ? ? ? background: blue;
? ? ? ? opacity: 0.3;
? ? ? ? filter:alpha(opacity:30);
? ? ? ?}
</style>
<script type="text/javascript">
? ? ? ?window.onload = function(){
? ? ? ? var test = document.getElementById('test');
? ? ? ? test.onmouseover = function(){
? ? ? ? startMove(this,'opacity',300);
? ? ? ? }
? ? ? ? test.onmouseout = function(){
? ? ? ? startMove(this,'opacity',200);
? ? ? ? }
? ? ? ?}
? ? ? ?var timer = null;
? ? ? ?function startMove(obj,attr,target){
? ? ? ? ?clearInterval(obj.timer);
? ? ? ? ? var speed=0;
? ? ? ? ? obj.timer = setInterval(function(){
? ? ? ? ? ?var icur = 0 ;
? ? ? ? ? ?if(attr=='opacity'){
? ? ? ? ? ?icur = Math.round(parseFloat(obj,attr)*100);
? ? ? ? ? ?}else{
? ? ? ? ? ?icur = parseInt(getStyle(obj,attr));
? ? ? ? ? ?}
? ? ? ? ? ?
? ? ? ? ? ?speed = (target-icur)/8;
? ? ? ? ? ?speed = speed>0?Math.ceil(speed):Math.floor(speed);
? ? ? ? ? ?if(icur==target){
? ? ? ? ? ?clearInterval(obj.timer);
? ? ? ? ? ?}else{
? ? ? ? ? ?if(attr=='opacity'){
? ? ? ? ? ? ? ? ? ?obj.style.opacity = (icur+speed)/100;
? ? ? ? ? ? ? ? ? ?obj.style.filter = 'alpha(opacity:'+(icur+speed)+')';
? ? ? ? ? ?}else{
? ? ? ? ? ? ? obj.style[attr] = icur+speed+'px';
? ? ? ? ? ?}
? ? ? ? ? ? ? ?
? ? ? ? ? ?}
? ? ? ? ? },30);
? ? ? ?}
? ? ? ? //獲取屬性
? ? ? ?function getStyle(obj,attr){
? ? ? ? if(obj.currentStyle){
? ? ? ? return obj.currentStyle[attr];
? ? ? ? }else{
? ? ? ? return getComputedStyle(obj,false)[attr];
? ? ? ? }
? ? ? ?}
</script>
</head>
<body>
<div id="test"></div>
</body>
</html>
2017-02-25
找到原因了,??icur = Math.round(parseFloat(obj,attr)*100);這里沒(méi)加getStyle,但是谷歌瀏覽器居然不給報(bào)錯(cuò)