CSS 光标 URL 在 Chrome 中不起作用答案

【问题标题】：CSS cursor URL not working in ChromeCSS 光标 URL 在 Chrome 中不起作用
【发布时间】：2017-07-31 03:05:07
【问题描述】：

我正在尝试使用带有此问题答案中给出的 URL 的自定义光标：（gmail 使用的抓取光标）

How can you implement a grabbing cursor icon in Chrome?

我正在使用 sn-p 中显示的这种确切方法，该方法有效。但是当我用我的实际项目尝试它时，我在 javascript 控制台中得到了这个错误：

获取文件：//ssl.gstatic.com/ui/v1/icons/mail/images/2/openhand.cur net::ERR_FILE_NOT_FOUND

这个错误是什么意思？我该怎么做才能让它发挥作用？

代码：

$('.hover').addClass('grab');

div {
  border: 1px solid black;
  height: 200px;
  width: 50%;
}

.grab {
  cursor: url(//ssl.gstatic.com/ui/v1/icons/mail/images/2/openhand.cur), default; !important
}

<div class="hover">

</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

【问题讨论】：

为什么不直接在本地保存光标并更改路径，而不是使用谷歌托管的路径？这是文件ssl.gstatic.com/ui/v1/icons/mail/images/2/openhand.cur
您的网址以// 开头-这意味着使用页面的“协议”-如果您使用file:/// 在本地加载页面-那么当然file://... 将不存在...这不是特定于 chrome 的问题，所有浏览器都会失败

标签： javascript jquery css url cursor

【解决方案1】：

file://ssl.gstatic.com/ui/v1/icons/mail/images/2/openhand.cur 你不小心说了file；它应该是https://ssl.gstatic.com/。它需要https:// 才能工作。

【讨论】：