想将光标更改为即时生成的光标图像

Question

我的网络应用程序从服务器接收事件以将光标更改为指定的 .cur 文件，并且此 .cur 文件作为 PNG 发送到浏览器（通过 WebRTC 数据通道）。是否可以将光标设置到这个内存中的 .cur 图像？

下面的行会将光标更改为存储在 URL 的 .cur 图像。但是，我想即时生成光标。

document.getElementById("video-container").style.cursor = "url('http://wiki-devel.sugarlabs.org/images/e/e2/Arrow.cur'), auto";

Answer 1

您可以简单地将 url 添加到您的图像中作为光标。

像这样：

channel.onmessage = (event) => {
  const blob = new Blob([event.data], { type: "image/png" });
  var url = URL.createObjectURL(blob);
  var elm = document.getElementById("video-container");
  elm.style.cursor = "url('" + url + "'), auto";
};

确保在设置光标后使用URL.revokeObjectURL释放已用内存。

想将光标更改为即时生成的光标图像

Would like to change the cursor to an on-the-fly generated cursor image

javascript

dom

cursor