CSS CUSTOM 마우스 커서 이미지 사용하기

CSS CUSTOM 마우스 커서 이미지 사용하기

사용자가 만든 이미지를 마우스 커서로 이용하는 방법이다.

첨부한 커서 이미지로 바꿔보았다.

http://www.cursor.cc/ 여기 가면 직접 커서 이미지를 만들수도 있다.

<style type="text/css">

canvas { cursor: url(../cursor/eraser.cur), auto; }

</style>

<script type="text/javascript">

$('#MyCanvas').css({'cursor':'url(../cursor/eraser.cur), auto'});

</script>

<canvas id="MyCanvas" width="300" height="300" style="border:1px solid #000000;"></canvas>

스크립트안에 코드는 jQuery 로 바꾸는 방법이다.

===== 예제 ( 아래 공간에 마우스를 움직여서 확인)

=====

erase.cur