免費(fèi)AI編程助手
Style cursor 屬性
Style 對象
定義和用法
cursor 屬性設(shè)置或返回鼠標(biāo)指針顯示的光標(biāo)類型。
語法
設(shè)置 cursor 屬性：
Object.style.cursor="value"
返回 cursor 屬性：
Object.style.cursor
| 值 | 描述 |
|---|---|
| auto | 默認(rèn)。瀏覽器設(shè)置的光標(biāo)（通常是一個(gè)箭頭）。 |
| crosshair | 光標(biāo)呈現(xiàn)為十字線。 |
| default | 默認(rèn)光標(biāo)（通常是一個(gè)箭頭）。 |
| e-resize | 向右（東）的箭頭，指示元素是可變尺寸的，矩形框的邊緣可被向右（東）移動(dòng)。 |
| help | 帶有問號的箭頭，指示可用的幫助。 |
| move | 交叉箭頭，指示某對象可被移動(dòng)。 |
| n-resize | 向上（北）的箭頭，指示元素是可變尺寸的，矩形框的邊緣可被向上（北）移動(dòng)。 |
| ne-resize | 東北方向的箭頭，指示元素是可變尺寸的，矩形框的邊緣可被向上及向右移動(dòng)（北/東）。 |
| nw-resize | 西北方向的箭頭，指示元素是可變尺寸的，矩形框的邊緣可被向上及向左移動(dòng)（北/西）。 |
| pointer | 光標(biāo)呈現(xiàn)為指示鏈接的指針（一只手）。 |
| s-resize | 向下（南）的箭頭，指示元素是可變尺寸的，矩形框的邊緣可被向下（南）移動(dòng)。 |
| se-resize | 東南方向的箭頭，指示元素是可變尺寸的，矩形框的邊緣可被向下及向右移動(dòng)（南/東）。 |
| sw-resize | 西南方向的箭頭，指示元素是可變尺寸的，矩形框的邊緣可被向下及向左移動(dòng)（南/西）。 |
| text | 此光標(biāo)指示文本。 |
| url | 需被使用的自定義光標(biāo)的 URL。提示： 請?jiān)诖肆斜淼哪┒耸冀K定義一種普通的光標(biāo)，以防沒有由 URL 定義的可用光標(biāo)。 |
| w-resize | 向左（西）的箭頭，指示元素是可變尺寸的，矩形框的邊緣可被向左（西）移動(dòng)。 |
| wait | 此光標(biāo)指示程序正忙（通常是一只表或沙漏）。 |
瀏覽器支持
所有主要瀏覽器都支持 cursor 屬性。
實(shí)例
實(shí)例
更改光標(biāo)：
<html>
<head>
<script>
function displayResult()
{
document.getElementById("p1").style.cursor="pointer";
}
</script>
</head>
<body>
<p id="p1">Mouse over this text!</p>
<br>
<button type="button" onclick="displayResult()">Change cursor</button>
</body>
</html>
<head>
<script>
function displayResult()
{
document.getElementById("p1").style.cursor="pointer";
}
</script>
</head>
<body>
<p id="p1">Mouse over this text!</p>
<br>
<button type="button" onclick="displayResult()">Change cursor</button>
</body>
</html>
嘗試一下 ?
更多實(shí)例
更多光標(biāo)
顯示所有可用的光標(biāo)。
Style 對象
更多建議：