รูปแบบของเคอร์เซอร์จะเปลี่ยนไปตามอิลิเมนต์ที่เมาส์ชี้ ปกติเมาส์จะเป็นรูปลูกศร ไม่ว่าจะเป็นขณะที่ชี้ข้อความ ลิงค์ เมาส์จะเปลี่ยนไปในรูปแบบต่าง ๆ แต่นอกจากนี้ ใน CSS ยังสามารถให้เปลี่ยนแปลงรูปร่างของของเคอร์เซอร์ตามที่ต้องการได้ เพื่อให้เว็บไซต์นั้นมีความน่าสนใจมากขึ้น
โค้ด: เลือกทั้งหมด
<html>
<head>
<style type="text/css">
.curMove{ //กำหนดชื่อ Class
cursor:move; //กำหนดรูปแบบเมื่อมีการย้ายตำแหน่งเคอร์เซอร์
}
</style>
<div class="curMove"></div> //เรียกใช้ Class
<div>
<div style="cursor:auto">เคอร์เซอร์แบบ Auto</div>
<div style="cursor:crosshair">เคอร์เซอร์แบบ Crosshair</div>
<div style="cursor:pointer">เคอร์เซอร์แบบ Pointer</div>
<div style="cursor:move">เคอร์เซอร์แบบ Move</div>
<div style="cursor:text">เคอร์เซอร์แบบ text</div>
<div style="cursor:wait">เคอร์เซอร์แบบ wait</div>
<div style="cursor:help">เคอร์เซอร์แบบ help</div>
</div>
</head>
<body>
</body>
</html>********************ผลลัพธ์ที่ได้********************
- 1.jpg (17.09 KiB) Viewed 714 times
- 2.jpg (50.07 KiB) Viewed 714 times
- 3.jpg (61.07 KiB) Viewed 714 times