图标随着鼠标移动案例解释节流

核心原理：流阀就相当于火车的厕所，有人进去了门锁就是红色，此时这人在里面尿尿1分钟，出来后为门锁绿色，代表下一个人可以进去；

HTML

$(function(){
            // 1、获取图片
           var duck =  $('#duck');
            // 节流阀1.设置节流阀
           var timer = null;

            // 2、mousemove事件
            $(document).on('mousemove',function(e) {

                // 节流阀3.判断节流阀是否为空 不为null则不执行其他行为
                if(timer) {return}

                // 节流阀2.开启延时器
                timer = setTimeout(function(){
                    // 设置图片的定位 把鼠标在document中的坐标给图片
                    $(duck).css('top',e.pageY +'px').css('left',e.pageX +'px');
                    console.log('ok!')
                    // 节流阀为null
                    timer = null
                },30)

            })
        })