Latest web development tutorials

Properti kursor HTML DOM Style

Gaya Referensi Obyek gaya Objects

Definisi dan Penggunaan

kursor set properti atau mengembalikan jenis layar pointer kursor mouse.

tatabahasa

Pengaturan kursor atribut:

Object.style.cursor="value"

Pengembalian atribut kursor:

Object.style.cursor

描述
auto 默认。浏览器设置的光标(通常是一个箭头)。
crosshair 光标呈现为十字线。
default 默认光标(通常是一个箭头)。
e-resize 向右(东)的箭头,指示元素是可变尺寸的,矩形框的边缘可被向右(东)移动。
help 带有问号的箭头,指示可用的帮助。
move 交叉箭头,指示某对象可被移动。
n-resize 向上(北)的箭头,指示元素是可变尺寸的,矩形框的边缘可被向上(北)移动。
ne-resize 东北方向的箭头,指示元素是可变尺寸的,矩形框的边缘可被向上及向右移动(北/东)。
nw-resize 西北方向的箭头,指示元素是可变尺寸的,矩形框的边缘可被向上及向左移动(北/西)。
pointer 光标呈现为指示链接的指针(一只手)。
s-resize 向下(南)的箭头,指示元素是可变尺寸的,矩形框的边缘可被向下(南)移动。
se-resize 东南方向的箭头,指示元素是可变尺寸的,矩形框的边缘可被向下及向右移动(南/东)。
sw-resize 西南方向的箭头,指示元素是可变尺寸的,矩形框的边缘可被向下及向左移动(南/西)。
text 此光标指示文本。
url 需被使用的自定义光标的 URL。提示: 请在此列表的末端始终定义一种普通的光标,以防没有由 URL 定义的可用光标。
w-resize 向左(西)的箭头,指示元素是可变尺寸的,矩形框的边缘可被向左(西)移动。
wait 此光标指示程序正忙(通常是一只表或沙漏)。

Dukungan Browser

Internet ExplorerFirefoxOperaGoogle ChromeSafari

Semua browser utama mendukung atribut kursor.


contoh

contoh

Mengubah kursor:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>本教程(w3big.com)</title>
<script>
function displayResult(){
    document.getElementById("p1").style.cursor="pointer";
}
</script>
</head>
<body>

<p id="p1">鼠标经过这个文本。</p>
<br>
<button type="button" onclick="displayResult()">修改光标类型</button>

</body>
</html>

Coba »


contoh

contoh yang lebih

lebih kursor
Menampilkan semua kursor tersedia.


Gaya Referensi Obyek gaya Objects