oneko.js icon indicating copy to clipboard operation
oneko.js copied to clipboard

doesn't detect movement on iframes

Open hacknorris-code opened this issue 1 year ago • 2 comments

see:

https://github.com/user-attachments/assets/c742a8c9-f9b9-4f3c-bed9-a6b248012154

hacknorris-code avatar Sep 24 '24 13:09 hacknorris-code

mousemove events aren't dispatched when hovering over an iframe in any browser, this is an intentional security decision made by browser implementers.

If the user isn't using the mouse to interact with the iframe (e.g. it's just static content), the easiest solution is to set pointer-events: none in CSS. If you expect the user to actually click things inside the iframe you'll need to take a different approach, this StackOverflow question has a few possibilities.

breqdev avatar Dec 25 '24 22:12 breqdev

there are buttons. yep. even whole games. gonna look at it. maybe it will be possible to enable it only of few subsites…

hacknorris-code avatar Dec 28 '24 11:12 hacknorris-code

I added a functionality like this for my site recently after finding out about oneko.js (frankly, I fell in love with it). It did require a bit of tweaking here and there but, in a nutshell, this is how I did it:

In each iframe I have on my site, I added a script that sends these messages to the element.

iframe.js

document.addEventListener("mousemove", (e) => {
  const rect = window.frameElement.getBoundingClientRect();
  window.parent.postMessage({
    type: "mousemove",
    x: e.clientX + rect.left,
    y: e.clientY + rect.top
  }, "*");
});

Now, around after appending the nekoEl element to the document and adding a "mousemove" event listener, I added another event listener, but this time to the message that I made above

oneko.js

    window.addEventListener("message", (event) => {
      if (event.data && event.data.type === "mousemove") {
        mousePosX = event.data.x;
        mousePosY = event.data.y;
      }
    });

nostalgiawitness avatar Aug 29 '25 18:08 nostalgiawitness

I wish there was a way to pin @nostalgiawitness's answer. Gonna close this issue as I don't plan on adding this to the main codebase.

adryd325 avatar Oct 29 '25 16:10 adryd325