Замена курсора Javascript

Question

Я ищу использовать анимированный курсор в JS. CSS custom cursors do not animate in most browsers.

Я слышал о людях (не помню, кто) это делает. Они скрывают обычный курсор (путем установки прозрачного пользовательского курсора), а затем создают изображение, которое следует за курсором в JS.

У кого-нибудь есть лучшие идеи для достижения анимированных курсоров? Есть ли плагин jquery, который сделает это за вас? Я помню, как читал блог об этом. Кто-нибудь слышал о людях, делающих это раньше?

Спасибо.

Answer 1

Have you tried using .ani cursors? См. Также controlling cursors with css. Я думаю, вы могли бы попытаться взломать это вместе самостоятельно, но я не вижу, как вы собираетесь скрыть исходный курсор. Вам действительно нужно что-то другое, кроме широко поддерживаемых обычных функций?

li { cursor: text; } 
a {cursor: pointer;} 

Answer 2

не пробовал это, но вы должны быть в состоянии создать пользовательские правила CSS (создать класс, как .customcursor, установите курсор на url(/path/to/image.png), а затем, на setInterval() цикла между изображениями. Затем применить это к вашему документ тела.

Я понятия не имею, как часто вы можете запустить, но он должен работать.

Answer 3

вы можете использовать прозрачный курсор, но некоторые в некоторых браузерах он будет показывать черный квадрат вместо того, чтобы быть Кроме того, я видел пару примеров, которые используют canvas для добавления эффектов к курсору.

Возможный пример http://jsfiddle.net/5mN9p/ заимствованы из этого вопроса Animated image mask following mouse in HTML

Все, что я добавил был

body{cursor:none;} 

или, возможно,

canvas{cursor:none;} 

Это означает, что вы можете сделать все, что вы хотите на холсте в то координаты мыши.