试图编写一个Fluid App用户脚本来禁止概念侧边栏自动弹出行为

Question

编辑----工作解决方案

试图禁用javascript事件是不可能的，相反，我最终在DOM中添加了一个额外的元素，用css切换侧栏的可见性，这就成功了。这不是最漂亮的解决方案，因为我只是在学习，但它确实解决了这个问题。

它不能作为Fluid用户脚本工作，但在浏览器中作为GreasemonkeyTampermonkey脚本工作。完整的代码在Github上 - 希望有更多知识的人对它进行改进。

原文

我是JS的新手，但正在努力边做边学。

我使用notion，每当鼠标悬停在应用程序的左侧时，就会弹出侧边栏，这让我非常恼火。

我在某处读到，我可以使用Fluid应用来推送用户脚本，而且可能可以通过自定义样式来禁用该功能。

但我似乎不知道如何让JS或CSS禁用鼠标悬停事件。

我想我找到了事件被监听的地方，但我不确定下一步如何删除该监听函数，或者停止该函数调用。

这就是我认为事件被触发的地方，谁能给点建议？

Answer 1

你可以在元素的容器中添加一个mousemove捕捉监听器与监听器。在mousemove时，如果目标（事件被派发到的元素）是你不想触发的带有页面监听器的元素的后裔，则可以调用 stopPropagation 上的事件。

例如，在下面的代码中，当一个元素或它的一个子代被悬停时，页面脚本试图给它着色，但第二部分（可以进入用户脚本）会阻止这一点。

// Page script:
nested.addEventListener('mousemove', (e) => {
  nested.style.color = 'red';
});

// Userscript:
outer.addEventListener('mousemove', (e) => {
  if (e.target.closest('#nested')) {
    e.stopPropagation();
  }
}, true);

<div id="outer">
  outer
  <div id="nested">
    nested
    <div id="inner">
      inner
    </div>
  </div>
</div>

Answer 2

所以我无法用最初的方法解决这个问题 最后我尝试了一个完全不同的方法，结果成功了。

还没能弄清楚如何让它在Fluid App中工作，但我确实管理了一个greasemonkey用户脚本。

我没有尝试改变事件监听器功能，而是控制侧栏的可见性。

我在DOM中添加了一个按钮，并给这个按钮一个触发器，以切换概念侧栏的可见性。点击按钮，侧边栏就不可见了，而且当你悬停在左侧时，什么也不会弹出。

这不是最漂亮的解决方案，因为它并没有删除notion现有的侧栏按钮，如果你没有用notion自己的按钮来最小化侧栏，那么格式化可能会有点古怪，但作为一个黑客，它完全可以工作。

我对JS和一般的编码非常陌生，所以这可能是非常低效的。但如果它能帮助任何人，这里是 代码在Github中 - 我很希望有人能帮我把它做得更好。