如何在Chrome中实现抓取光标图标？

Question

我知道可以在Chrome中使用抓取光标图标(当然是在Gmail中),但我无法弄清楚如何在我的代码中实现它.我试过(在CSS中):

body {
  cursor: grab;
}

body {
  cursor: -webkit-grab;
}


body {
  cursor: url(http://www.worldtimzone.com/mozilla/testcase/css3cursors_files/grab.gif);
}

Answer 1

Chrome在"抓取"名称之前需要-webkit-;

下面是一个适用于Chrome和Mozilla的样式示例,其中包括当您"抓住"某些内容时光标的更改.

#eA { cursor: -webkit-grab; cursor:-moz-grab; }
#eA:active { cursor: -webkit-grabbing; cursor:-moz-grabbing;}

参考:https://developer.mozilla.org/en-US/docs/Web/CSS/cursor

Answer 2

这是gmail使用的样式,如果这是你想要的精确光标样式:

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

你可以在这里测试一下.

Answer 3

因此,在CSS中,您可以从基础开始,然后转向更加模糊的内容.浏览器将选择适用于该特定浏览器的最后一个.无论出于何种原因,Chrome支持webkit-grab但不支持抓取.

body {
  cursor: pointer;
  cursor: hand;
  cursor: -webkit-grab;
  cursor: grab;
}

关于您关于操作此操作的能力的后续问题,请尝试使用以下内容:

document.body.style.cursor = 'move';