Microsoft Edge上的自定义光标有偏移

问题描述 投票:1回答:2

我有一个自定义光标,通过使用CSS属性cursor在Chrome和Firefox上工作。但是,在Microsoft Edge上,光标似乎具有偏移量。为了准确选择项目,我必须在自定义光标上方定位一点。

有什么我可以解决的办法吗?还是这是某种限制?

编辑:我应该提到我正在使用自定义图像作为光标。

css css3 cursor microsoft-edge
2个回答
1
投票

仅在IE和Edge中均支持.cur文件,请参见https://msdn.microsoft.com/en-us/library/aa358795(v=vs.85).aspx。 (Edge支持其他格式,但不支持您在对Martin Beeby的答案发表评论时提到的交互点定义,使这些交互点变得毫无用处。).cur文件允许您定义交互点。只需在Google上搜索“ .cur编辑器”,然后选择适合您的编辑器即可创建.cur文件。

由于其他浏览器确实支持交互点的定义,但不支持.cur格式,因此必须在css中定义两个光标属性,第一个使用.cur文件,第二个使用.png或其他格式,并且交互点定义。 IE和Edge将忽略第二个,对于其他浏览器,.cur文件将被覆盖,这样它将跨浏览器工作。

div {
    cursor: url(path/to/cursor.cur), auto; /*IE and Edge*/
    cursor: url(path/to/cursor.png) 4 12, auto; /*Chrome, FF, etc.*/ 
}

附注,请务必阅读这篇(http://blog.stchur.com/2006/11/02/ie-bug-dealing-with-css-custom-cusors/)文章。它与IE 6和7中的一个相对路径错误有关,但该错误仍在IE 11中存在。尽管如此,该错误似乎在Edge中得到了解决(至少在我最近尝试过时)。因此,您需要弄一点.cur文件的路径,以使其在IE和Edge上均可使用。请参阅本文中提到的解决方法。


0
投票

在CSS中,您可以传入指定交互点的坐标。

也许添加这些将有助于解决您的问题?

/* Using URL and coordinates */
cursor:  url(cursor1.png) 4 12, auto;

-3
投票

[强文本] [1]一整天都吸鸡巴

[1]M3RK:http://Https://youtube.com/subscribers

© www.soinside.com 2019 - 2024. All rights reserved.