soooulp
V2EX  ›  问与答

划词搜索脚本如何添加一个函数,判断鼠标放到图标栏不自动消失呢

  •  
  •   soooulp · May 4, 2020 · 1272 views
    This topic created in 2209 days ago, the information mentioned may be changed or developed.

    用油猴划词搜索脚本,划词会弹出图标栏,试了下使用 mouseIn 、mouseOver 函数,把鼠标移到图标栏的时候,都不能不自动消失,一定是哪里弄错了,感谢大佬指导
    完整代码
    浏览器搜索扩展工具
    原先是使用的 mouseIn,添加代码最前面,请问这一块要如何写呢

    mouseIn: 0;
    
        var TimeOutHide = function () {
            if (mouseIn === 0) {
                return fadeOut(icon);
            }
        };
    

    原脚本前面的图标栏的内容:
     var iconArray = [
            {
                name: '打开',
                image: 'https://i.ibb.co/PQ5xM2R/2-1.png',
                host: [''],
                popup: function (text) {
                    if(text.indexOf("http://")==0||text.indexOf("https://")==0)
                    window.open(text, "_blank");
                    else window.open("http://"+text, "_blank");
                }
    
            },
    

    然后在划词弹窗这样使用
    timer = window.setTimeout(TimeOutHide, 6000);
    



    Supplement 1  ·  May 4, 2020

    改用原生的js实现mouseenter,提示Cannot read property 'relatedTarget' of undefined

        var hide_controls=function(e){
                            // console.log(this);	if(e.relatedTarget!==e.currentTarget&&e.currentTarget.getElementsByClassName(e.relatedTarget.className).length===0){
              icon.style.display = 'none';
             }
        }
    
        timer = window.setTimeout(hide_controls, 6000);
    
    Supplement 2  ·  May 6, 2020

    不挪鼠标可以自动关闭、鼠标放icon上不关闭、快速移开鼠标可以自动关闭

    鼠标长时间放icon上,再移开又不自动关闭了,怎么解决呀

        var TimeOutHide;
        var ismouseenter = false;
    
        icon.onmouseenter = function(){
            console.log("ismouseenter");
            if(ismouseenter == true){ //已经移入直接返回
                return;
            } else {
                ismouseenter = true; // 状态设为移入
            }
        };
    
        icon.onmouseleave = function(){
            console.log("ismouseleave");
            if(ismouseenter == false){
                return;
            } else {
                ismouseenter = false;
            }
        };
    
        TimeOutHide = function () {
            if (ismouseenter == false) {
                return fadeOut(icon);
                console.log("doSomethingOk");
            }
        };
    
         fadeIn(icon);
    	
         clearTimeout(timer);
         timer = window.setTimeout(TimeOutHide, 6000);
    
    1 replies    2020-05-07 10:08:08 +08:00
    soooulp
        1
    soooulp  
    OP
       May 7, 2020
    解决啦,在 icon.onmouseenter 、icon.onmouseleave 中分部加入 clearTimeout(timer);,清除定时就好了
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   2907 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 27ms · UTC 14:06 · PVG 22:06 · LAX 07:06 · JFK 10:06
    ♥ Do have faith in what you're doing.