คุณสมบัติ cursor กำหนดลักษณะภายนอก
ของเคอร์เซอร์เมื่อเลื่อนเมาส์ไปวางบนองค์ประกอบ
ไวยากรณ์
selector {
cursor: value;
}
หมายเหตุ
คุณสมบัตินี้มีค่าที่เป็นไปได้มากมาย ด้านล่างนี้
ผมได้จัดกลุ่มค่าเหล่านี้ เพื่อให้ง่ายต่อการใช้งาน
ลักษณะของเคอร์เซอร์จะแตกต่างกัน
ในเบราว์เซอร์ที่ต่างกัน ดังนั้นผมจึงไม่ได้ใส่ภาพ
ของเคอร์เซอร์ แต่ในตารางที่แสดงค่า
ผมได้ทำคอลัมน์พิเศษ โดยเมื่อเลื่อนเมาส์ไปวาง
บนเซลล์นั้น คุณจะสามารถเห็นลักษณะภายนอก
ของเคอร์เซอร์ที่กำลังอธิบาย
ค่า
| ค่า |
คำอธิบาย |
ลักษณะภายนอก |
default |
ลักษณะมาตรฐานในรูปแบบของลูกศรชี้
|
|
pointer |
ใช้เพื่อแสดงว่าองค์ประกอบ
นั้นใช้งานได้และสามารถคลิกได้
(ค่าเริ่มต้นสำหรับลิงก์)
|
|
help |
ใช้เพื่อแสดงว่ามีความช่วยเหลือหรือคำถาม
ที่เกี่ยวข้องกับองค์ประกอบนั้น
|
|
not-allowed |
ใช้เพื่อแสดงว่าการดำเนินการนั้นไม่อนุญาต
|
|
ข้อความ
| ค่า |
คำอธิบาย |
ลักษณะภายนอก |
text |
เคอร์เซอร์ข้อความมาตรฐานในรูปแบบของเส้นตั้ง
|
|
vertical-text |
เคอร์เซอร์ข้อความสำหรับข้อความแนวตั้ง
|
|
การรอ
| ค่า |
คำอธิบาย |
ลักษณะภายนอก |
progress |
ใช้เพื่อแสดงว่ากำลังเกิด
การดำเนินการบางอย่าง และผู้ใช้จำเป็นต้องรอ
|
|
wait |
ใช้เพื่อแสดงว่าผู้ใช้
จำเป็นต้องรอ
|
|
เคอร์เซอร์เมื่อเปลี่ยนแปลงขนาด
เมื่อเปลี่ยนขนาดขององค์ประกอบ ค่า
ของคุณสมบัติจะถูกสร้างขึ้นดังนี้: คำว่า resize,
และก่อนหน้าคำนั้นด้วยเครื่องหมายยัติภังค์จะมีตัวอักษรหนึ่งตัวหรือ
หลายตัว เช่น: n-resize หรือ ne-resize
ตัวอักษรเหล่านี้เป็นอักษรตัวแรกของทิศทาง
ตามเข็มทิศ: north - ทิศเหนือ, south - ทิศใต้, east - ทิศตะวันออก,
west - ทิศตะวันตก ในกรณีนี้จะใช้
าข้อตกลงที่ใช้สำหรับแผนที่ภูมิประเทศ:
ด้านบนคือทิศเหนือ, ด้านล่างคือทิศใต้, ด้านซ้ายคือทิศตะวันตก, ด้านขวา
คือทิศตะวันตก แน่นอนว่าสิ่งนี้อาจทำให้สับสน แต่เราจำเป็นต้อง
ใช้ตามที่กำหนดไว้ :)
ดังนั้น นี่คือค่า:
| ค่า |
ทิศทาง |
ทิศเข็มทิศ |
ลักษณะภายนอก |
n-resize |
ขึ้น |
north |
|
ne-resize |
ขวาขึ้น |
nord east |
|
e-resize |
ขวา |
east |
|
se-resize |
ขวาลง |
south east |
|
s-resize |
ลง |
south |
|
sw-resize |
ซ้ายลง |
south west |
|
w-resize |
ซ้าย |
west |
|
nw-resize |
ซ้ายขึ้น |
nord west |
|
nesw-resize |
ขวาขึ้นและซ้ายลง |
nord east - south west |
|
nwse-resize |
ซ้ายขึ้นและขวาลง |
nord west - south east |
|
การเปลี่ยนแปลงขนาดของสององค์ประกอบ
| ค่า |
คำอธิบาย |
ลักษณะภายนอก |
col-resize |
การเปลี่ยนแปลงในแนวนอน |
|
row-resize |
การเปลี่ยนแปลงในแนวตั้ง |
|
การเปลี่ยนแปลงซูม
| ค่า |
คำอธิบาย |
ลักษณะภายนอก |
zoom-in |
การขยายซูม |
|
zoom-out |
การลดซูม |
|
การเคลื่อนย้าย
| ค่า |
คำอธิบาย |
ลักษณะภายนอก |
move |
ใช้เพื่อแสดงว่าองค์ประกอบ
สามารถเคลื่อนย้ายได้ หรือในขณะที่กำลังเคลื่อนย้าย
|
|
all-scroll |
ใช้เพื่อแสดงว่าองค์ประกอบ
สามารถเลื่อนด้วยเมาส์ได้ในทุกทิศทาง
|
|
อื่นๆ
| ค่า |
คำอธิบาย |
ลักษณะภายนอก |
crosshair |
ลักษณะภายนอกในรูปแบบของ crosshair
|
|
cell |
ลักษณะภายนอกในรูปแบบของ crosshair
|
|
