如何让鼠标光标抓住鼠标？

Question

我已经在JSFIDDLE
UPDATE 上做了一个演示,这个版本适用于FF而不是chrome ..
更新2这个网站似乎有一个可行的解决方案.

我的Javascript如下

$("#click").live({
  mousedown: function() {
            this.addClass("closed");
        },
  mouseup: function() {
            this.removeClass("closed");
        }
});

CSS如下

.closed {
    cursor: url(https://mail.google.com/mail/images/2/closedhand.cur), default !important;
}

但是为什么光标在使用这个jQuery代码时不能成为一个关闭的手？非常感谢!任何帮助,将不胜感激!

Answer 1

您只能使用CSS获取鼠标光标：

/* Standard cursors */    
.element { cursor: grab; }
.element:active { cursor: grabbing; }

/* Custom cursors */
.element { cursor: url('open-hand.png'), auto; }
.element:active { cursor: url('closed-hand.png'), auto; }

Answer 2

2016年更新：

需要在我正在开发的jQuery滑块插件中执行此操作。我所做的就是在CSS中定义光标，然后使用jQuery在触摸/鼠标事件上添加/删除它们。

CSS：

.element:hover{
    cursor: move;
    cursor: -webkit-grab;
    cursor: grab;
}
.element.grabbing { 
    cursor: grabbing; 
    cursor: -webkit-grabbing;
}

JS：

$(".element").on("mousedown touchstart", function(e) {
    $(this).addClass('grabbing')
})

$(".element").on("mouseup touchend", function(e) {
    $(this).removeClass('grabbing')
})