html - 如何在没有 mousemove 事件的情况下触发自定义光标更改(jQuery)

Question

尝试改变光标

我正在尝试制作一个可拖动的可滚动图像，因此我试图在将变量设置为缩放模式时更改图像上的光标，以便我具有良好的可用性。我发现的是，光标只会在我单击“.page”后发生变化，然后移动鼠标，而不是像我单击页面时那样移动鼠标。下面是一些示例代码:

$(".page").on("mousedown", function (evt) {
    if(model.zoomMode){
        $('.page').css('cursor','url("img/hand_closed.gif"),auto');
    }       
}).on("mouseup", function (evt) {
    if(model.zoomMode){
        $('.page').css('cursor','url("img/hand_open.gif"),auto');
    }
});

另一种更依赖CSS的方法

当我使用类来实现相同的效果时，似乎也会发生这种情况。 IE。缩放模式在 .page 对象之外添加一个类，然后 javascript 是:

$(".page").on("mousedown", function (evt) {
    $('.page').addClass('mouseDown');
}).on("mouseup", function (evt) {
    $('.page').removeClass('mouseDown');
});

然后在 CSS 中:

.zoom .page:hover{
    cursor:url(../img/hand_open.gif),auto;
}

.zoom .page.mouseDown:hover{
    cursor:url(../img/hand_closed.gif),auto;
}

我正在使用 chrome 18 进行测试。有人知道无需移动鼠标即可触发应用 CSS 光标的方法吗？

Answer 1

简短回答:否。

长答案:不，抱歉。

( source )