CSS 사용자 정의 커서에 외부 이미지 사용

Question

CSS 사용자 정의 커서에 외부 이미지 URL을 사용할 수 있습니까? 다음 예제는 작동하지 않습니다

HTML :

<div class="test">TEST</div> 

CSS :

.test { 
    background:gray; 
    width:200px; 
    height:200px; 
    cursor:url('http://upload.wikimedia.org/wikipedia/commons/d/de/POL_apple.jpg'); 
} 

바이올린 : http://jsfiddle.net/wNKcU/4/

Answer 1

이미지가 있었기 때문에 그것은 작동하지 않는

너무 큽니다 - 이미지 크기에 제한이 있습니다. 예를 들어, Firefox에서는 크기 제한이 128x128px입니다. 자세한 내용은 this page을 참조하십시오.

또한 auto을 추가해야합니다.

jsFiddle demo here - 이는 실제 이미지이며 기본 커서는 아닙니다.

.test { 
 
    background:gray; 
 
    width:200px; 
 
    height:200px; 
 
    cursor:url(http://www.javascriptkit.com/dhtmltutors/cursor-hand.gif), auto; 
 
}

<div class="test">TEST</div>

Answer 2

나는 주석으로이 둘 것입니다,하지만 난 그것을 위해 담당자가 없습니다. 조쉬 크르 지어 (Josh Crozier)가 대답 한 내용은 정확하지만 IE의 경우 .cur 및 .ani만이이를 지원하는 형식입니다. 그래서 당신은 아마 경우에 대체이 있어야합니다

.test { 
    cursor:url("http://www.javascriptkit.com/dhtmltutors/cursor-hand.gif"), url(foo.cur), auto; 
}