透明度变化问题，应该是鼠标移动变不透明，移开变0.3透明度，可是不知道哪的问题

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <style>
        *{margin: 0;
            padding: 0;
        }
        ul{
            list-style: none;position: fixed ;top: 20%;
        }
        ul li {
            width:200px;
            height: 100px;
            background:#5a5a5a;
            margin-bottom: 20px;
            opacity:0.3;
        }

    </style>
    <script>
        window.onload = function()
        {
            var Li1=document.getElementById('id1');
            var Li2=document.getElementById('id2');
            Li2.onmousemove=function(){
                startMove(this,{'width':400,'opacity':100})
            }
            Li2.onmouseout=function(){
                startMove(this,{'width':200,'opacity':30})
            }
        }
        //var timer= null;
        function startMove(obj,json,fn)/*obj多个参数的定义*/
        {
            clearInterval(obj.timer);
            var a=true;
            obj.timer = setInterval(function(){

                for(var attr in json) {
                    var icur=0;
                    if(attr=='opacity'){
                        icur=parseInt(getstyle(obj, attr))*100
                    }else {icur=parseInt(getstyle(obj, attr))}
                    var speed = (json[attr] - icur) / 3;
                    speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed);
                    if (icur!= json[attr])
                    {
                        a=false;
                        if(attr=='opacity'){
                            obj.style['opacity']=(icur+speed)/100;
                        }
                        else {obj.style[attr] = icur + speed + 'px';}
                    }

                }
                if(a){
                    clearInterval(obj,timer);
                    if(fn){fn();}
                }

            },30)}
        function getstyle(obj,attr){
            if(obj.currentStyle){
               return obj.currentStyle[attr]
            }
            else {
               return getComputedStyle(obj,false)[attr]
            }
        }
    </script>
</head>
<body>
<ul>
    <li id="id1">11</li>
    <li id="id2">22</li>
    <li id="id3"></li>
</ul>
</body>
</html>

慕府戏子

浏览 1566回答 5

5回答

南风蛮

效果已经出来没错，如果是透明度没变化，opacity不支持ie8及以下，你可以替换成filter兼容

一杯2块的奶茶

他当前得到的透明度和宽度始终是0.3和200呀，数值上下波动后，到后面就不变了，感觉确实是有问题的，但是我也没解决，哎，研究了一会，看是看懂了，这个问题我之前也看到过，后面不了了之了，现在又看到了

ziom

谢邀。不过我很长时间没接触js了，你找错了人。

刚毅87

没问题啊,效果还不错.

随时随地看视频慕课网APP