Question

在Chrome上无法动态地使用cursor: none;（与javascript一起使用）。这在Opera或Firefox上效果很好。 CSS实际上发生了变化，但是光标没有被隐藏！ YouTube也使用此逻辑，结果相同。

var mouseTimeout;
document.body.onload = function () {
    const $ = document.querySelector.bind(document);
    $('.building').addEventListener('mousemove', cursorHandler);

}

function cursorHandler() {
    console.log('cursorHandler');
    document.querySelector('.building').style.cursor = 'default';
    console.log('show curser');
    if (mouseTimeout) {
        clearTimeout(mouseTimeout);
    }
    mouseTimeout = setTimeout(() => {
        console.log('hide curser');
        document.querySelector('.building').style.cursor = 'none';
    }, 3000);
}

有人知道解决此问题的好方法吗？

Answer 1

不确定是否有帮助，但是当我打开Chrome Developer工具时，不一致。一旦关闭它，一切都会按预期进行。我正在使用一个透明的.gif文件作为光标。干杯！

光标：无；不适用于chrome

1 个答案: