개체 위에 마우스 포인터가 왔을 때 디스플레이된는 커서(cursor) 형식을 반환하거나 설정한다.

인수
cssSelector : (스타일 선택자)
속성을 가질수 있는 엘레멘트()나 클라스(class) 이름 혹은 인식자(id)이다.

: (속성 문자열)
스타일 속성은 개체 위에 마우스 포인터가 왔을 때 디스플레이된는 커서(cursor) 형식을 나타내는 문자열이다.

all-scroll IE6 이후, 위로, 아래로, 외쪽으로, 오른쪽으로의 화살표 커서로 표시하여 문서가 어느방항으로라도 스크롤된다는 것을 나타낸다.
auto 디폴트이며, 디스플레이되는 브라우저의 커서를 현재 설정에따라 결정한다.
col-resize IE6 이후, 왼쪽으로, 오른쪽으로 화살표와 두개의 수직선으로 구성된 커서로 컬럼이나 항목을 수평으로 폭이 조절된다는 것을 나타낸다.
crosshair 단순한 얇은 십자형 커서이다.
default 플래트폼에 따른 디폴트 커서로 일반적으로 화살표이다.
hand 가리키는 손가락 커서로 일반적으로 연결에 마우스를 올렸을 때 나타난다.
help 물음표를 동반한 화살표 커서로 도움말을 나타낸다..
move 위로, 아래로, 외쪽으로, 오른쪽으로의 화살표 커서로 이동된을 나타낸다.
no-drop IE6 이후, 손가락과 작은 금지표시 커서로 끌어놓기 항목이 현재 커서의 위치에서 놓기할 수 없음을 나타낸다.
not-allowed IE6 이후, 금지표시 커서로 요청된 작용이 되지 않음을 나타낸다.
pointer IE6 이후, 가리키는 손가락 커서로 일반적으로 연결에 마우스를 올렸을 때 나타나며, hand 값과 동일하다.
progress IE6 이후, 화살표와 모래시계커서로 진행되고있음을 나타낸다. 사용자의 작동은 영향을 주지 않는다..
row-resize IE6 이후, 위쪽으로, 아래쪽으로 화살표와 두개의 수편선으로 구성된 커서로 줄이나 항목을 수직으로 높이가 조절된다는 것을 나타낸다.
text 텍스크 수정에 사용되는 커서이며 보통 | 형태이다.
url(uri) IE6 이후, 사용자에 의하여 url('customcursor.cur') 식으로 정의되는 커서로서 커서의 주소(URI)로 연결된다. 여기서 사용될 수 있는 파일 형식은 .cur와 .ani 두가지만 가능하다.
vertical-text IE6 이후, 텍스크 수정에 사용되는 커서이며 수평 -- 형태이다.
wait 모래시계 모양의 커서로 현재 진행 중이며 사용자가 기다려야 함을 나타낸다..
*-resize 화살표와 이동시킬 방향을 나타내는 커서이다. 별표(*)는 N, NE, NW, S, SE, SW, E,혹은 W이 될 수 있으며, 각 문자열은 나침판 방향이다.

이 속성은 currentStyle에서는 읽기전용이고, 그외의 개체에서는 읽기/쓰기이며, 디폴트값은 auto이다.

CSS(Cascading Style Sheets) 애트리뷰트는 상속된다.

특기
IE6에서 이 속성의 값 progress, not-allowed, no-drop, vertical-text, all-scroll, col-resize, row-resize가 사용될 수 있고, url(uri)이 새로운 값으로 사용될 수 있다.

각 속성값들은 컴마(,)로 분리된 값들의 목록이 될 수 있고, 사용도구가 목록의 처음 커서를 지원하지 않거나 사용할 수 없으면, 다음 값에서 커서를 사용할 수 있을 때까지 찾는다. 끝까지 사용할 수 있는 커서를 찾지 못하면 커서는 변경되지 않는다.

적용
개체scriptCSS IE 버전
참조

이 속성은 CSS2(Cascading Style Sheets Level 2)에 정의되었다.


cursor를 선택하고 이 예제 DIV애 마우스를 올려보라.
결과 표시창

IE6에서는 이들 커서들이 모두 지원된다.

<SCRIPT>
function showAll(cursorType){
  divObj.style.cursor=cursorType;
  str='divObj.style.cursor=<FONT color=blue>'+divObj.style.cursor+'</FONT>';
  showA.innerHTML=str;
}
</SCRIPT>
<DIV id="divObj"
  style="border:solid 1 blue;background-color:ffa;padding:5;width:400">cursor를 선택하고 이 예제 DIV애 마우스를 올려보라.</DIV>
<SELECT id="selObj" onchange="showAll(selObj.options[selObj.selectedIndex].text)" size=8>
<OPTION>all-scroll
<OPTION>col-resize
<OPTION>crosshair
<OPTION>default
<OPTION selected>hand
<OPTION>help
<OPTION>move
<OPTION>no-drop
<OPTION>not-allowed
<OPTION>pointer
<OPTION>progress
<OPTION>row-resize
<OPTION>text
<OPTION>url(../../gif/lns.cur)
<OPTION>vertical-text
<OPTION>wait
<OPTION>NW-resize
<OPTION>NE-resize
</SELECT>
<DIV id=showA>결과 표시창</DIV>