Custom CSS .cur cursor anchor point is ignored

• Component: CSS
• Status: RESOLVED FIXED

[Sasha Aickin]

Create a page that uses a CSS custom cursor with a rule such as:

cursor: url(http://maps.live.com/cursors/grab.cur);

Rather than being anchored at the upper left finger of the cursor, as it is on IE, the cursor is anchored approximately 8 pixels up and to the left from the image.  This causes weird jumping effects when custom cursors like this are used.

Test page to follow.

Tested in build 522.15.5.

[Sasha Aickin]

Created attachment 16969 [details]
test page that demonstrates the bug

Added a test page that demos the bug.

[David Kilzer (:ddkilzer)]

Verified with a recent Safari for Windows on XP Pro.

Even stranger is that the custom "grab" cursor specified in the CSS doesn't appear at all with Safari 3 Public Beta v. 3.0.3 (522.12.1) with a local debug build of WebKit r27306 on Mac OS X 10.4.10 (8R218).

[David Kilzer (:ddkilzer)]

$ curl --head http://maps.live.com/cursors/grab.cur
HTTP/1.1 200 OK
Content-Length: 4286
Content-Type: application/octet-stream
Last-Modified: Sun, 23 Sep 2007 23:26:12 GMT
Accept-Ranges: bytes
ETag: "fb2b1d2139fec71:907"
Server: Microsoft-IIS/6.0
P3P: CP="BUS CUR CONo FIN IVDo ONL OUR PHY SAMo TELo"
X-Powered-By: ASP.NET
Date: Thu, 01 Nov 2007 06:07:19 GMT

[David Kilzer (:ddkilzer)]

(In reply to comment #2)
> Even stranger is that the custom "grab" cursor specified in the CSS doesn't
> appear at all with Safari 3 Public Beta v. 3.0.3 (522.12.1) with a local debug
> build of WebKit r27306 on Mac OS X 10.4.10 (8R218).

Filed Bug 15783 for this issue on OS X.

[Alexey Proskuryakov]

See also: <rdar://problem/4556355>. I suppose fixes are needed in both CG and WebKit.

[Dan Fabulich]

Probably related to bug 8989.  That extra byte of difference between a .cur and a .ico includes the anchor point of the cursor.

[Alexey Proskuryakov]

*** Bug 22453 has been marked as a duplicate of this bug. ***

[Alexey Proskuryakov]

*** Bug 18810 has been marked as a duplicate of this bug. ***

[Scott Bell]

This bug makes it impossible to have non-pointer cursors
(such as a hand, or spreadsheet cell cursor) work well in
WebKit. Google Maps is a popular application which behaves
poorly in WebKit due to this bug. 

Our application makes use of two custom cursors, one for
resizing and one to simulate the CSS3 `cell' cursors on 
unsupported browsers (such as WebKit). Both of these have
a hotspot at 6,6, which is far off from the 0,0 value that
WebKit uses, which causes the UI to behave unacceptably.

[Scott Bell]

(In reply to comment #9)
> Our application makes use of two custom cursors, one for
> resizing and one to simulate the CSS3 `cell' cursors on 
> unsupported browsers (such as WebKit). Both of these have
> a hotspot at 6,6, which is far off from the 0,0 value that
> WebKit uses, which causes the UI to behave unacceptably.

Correction: we use a custom .CUR file for `cell' to ensure
consistency across browsers, not because WebKit doesn't
support it (it does).

[Alexey Proskuryakov]

This is a compatibility bug, but I think it can be worked around.  You can specify the hotspot position in CSS, see <http://www.w3.org/TR/css3-ui/#cursor>.

[Scott Bell]

(In reply to comment #11)
> This is a compatibility bug, but I think it can be worked around.  You can
> specify the hotspot position in CSS, see
> <http://www.w3.org/TR/css3-ui/#cursor>.

This workaround does seem to work for the latest WebKit,
unfortunately Safari renders the fallback cursor instead at
the moment. Thanks!

[Alexey Proskuryakov]

The document needs to be in strict parsing mode for that to work in Safari 4 - that was fixed in bug 27390.

[Alexey Proskuryakov]

<rdar://problem/8002964>

[Alexey Proskuryakov]

*** Bug 39824 has been marked as a duplicate of this bug. ***

[bugzilla33]

URL: http://pc44.one.pl/goorol/bugs/safari/cursor.html

[bugzilla33]

Created attachment 57306 [details]
new testcase

[Alexey Proskuryakov]

Created attachment 58107 [details]
proposed fix

[Alexey Proskuryakov]

Committed <http://trac.webkit.org/changeset/60849>.

Please note that this will only work in nightly builds with Safari 5 for Windows for now. Fixing this on Mac OS X is tracked by Apple internally as <rdar://problem/4556355>.

[WebKit Review Bot]

http://trac.webkit.org/changeset/60849 might have broken Qt Linux Release minimal

[Eric Seidel (no email)]

Qt is very sad after this change.

[Csaba Osztrogonác]

(In reply to comment #21)
> Qt is very sad after this change.
Fixed by http://trac.webkit.org/changeset/60854.

[Alexey Proskuryakov]

> Fixing this on Mac OS X is tracked by Apple internally as <rdar://problem/4556355>.

Fixed in Mac OS X 10.6.5 - should work with WebKit nightlies now.

[Shane Stephens]

*** Bug 20826 has been marked as a duplicate of this bug. ***