使用 JQuery css 方法自定义 CSS 光标答案

【问题标题】：Custom CSS cursor using JQuery css method使用 JQuery css 方法自定义 CSS 光标
【发布时间】：2013-03-19 07:44:27
【问题描述】：

有没有办法可以使用 JQuery 的 .css() 方法来提供以下光标样式？：

cursor: url(http://www.google.com/intl/en_ALL/mapfiles/closedhand.cur), default !important;

【问题讨论】：

标签： jquery css

【解决方案1】：

jQuery 不理解!important，所以如果你删除它就会起作用：

$('selector').css({
    'cursor': 'url(http://www.google.com/intl/en_ALL/mapfiles/closedhand.cur), default'});

有办法绕过它，为什么不使用 CSS 类？

/* CSS */
.cursor {
    cursor: url('http://www.google.com/intl/en_ALL/mapfiles/closedhand.cur'), default !important;
}

所以你可以：

$('selector').addClass('cursor');

【讨论】：

我正在使用 JQuery UI Sortable，它采用光标选项并使用 .css() 设置光标样式。我尝试过使用鼠标事件处理光标更改，但遇到了重置光标的麻烦。使用库的光标选项给我预期的光标重置。
如果您使用 <a> 元素，那么您可以在 CSS a:hover{ cursor: .... } 中执行此操作，并且根本不使用 JavaScript。

【解决方案2】：

使用下面的代码在fiddle 中对我来说似乎工作正常，但是如上所述，我删除了使其工作的!important。

$('#cursor').css(        
    'cursor','url(http://www.google.com/intl/en_ALL/mapfiles/closedhand.cur),default'
);

【讨论】：