我是超级无敌老锦鲤 2020-03-07 06:10 采纳率: 100%
浏览 292
已采纳

鼠标移出后图片会闪烁 ,这opacity一直在0.3和0.2之间跳这是为啥呀

    <style>
        #img1{
            opacity: 0.3;
        }
    </style>
    <script type="text/javascript">
        window.onload=function()
        {
            var oimg=document.getElementById('img1');
            oimg.onmousemove=function()
            {
                movestar(1);
            }
            oimg.onmouseout=function()
            {
                movestar(0.3);
            }
        }
        var timer=null;
        var opa=0.3;
        var speed=0;
        function movestar(itarget)
        {
            var oimg=document.getElementById('img1');
            clearInterval(timer);
            timer=setInterval(function()
            {

                if(opa<itarget)
                {
                    speed=0.1;
                }
                else
                {
                    speed=-0.1;
                }
                if(opa==itarget)
                {
                    clearInterval(timer);
                }
                else{
                    opa+=speed;
                    oimg.style.opacity=opa;
                }

            },30);
        }
    </script>
</head>
<body>
    <img id="img1" src="img/IMG_5894.JPG" />
</body>

展开全部

  • 写回答

1条回答 默认 最新

  • 小蓝Lany 2020-03-07 11:54
    关注

    这是因为js的数字运算精度缺失问题,比如:0.7 + 0.1不是等于0.8而是0.7999999999999999,0.4 - 0.1不是0.3而是0.30000000000000004,不相信的话可以去浏览器试试。
    所以你的代码需要改一个地方就可以了,把opa += speed改成

    opa = parseFloat((opa+speed).toFixed(10))
    

    另外,你最好不要使用mousemove,改成mouseover或者mouseenter

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
编辑
预览

报告相同问题?

悬赏问题

  • ¥15 DevEco studio开发工具 真机联调找不到手机设备
  • ¥15 请教前后端分离的问题
  • ¥100 冷钱包突然失效,急寻解决方案
  • ¥15 下载honeyd时报错 configure: error: you need to instal a more recent version of libdnet
  • ¥15 距离软磁铁一定距离的磁感应强度大小怎么求
  • ¥15 霍尔传感器hmc5883l的xyz轴输出和该点的磁感应强度大小的关系是什么
  • ¥15 vscode开发micropython,import模块出现异常
  • ¥20 Excel数据自动录入表单并提交
  • ¥30 silcavo仿真,30分钟,只需要代码
  • ¥15 FastReport 怎么实现打印后马上关闭打印预览窗口