การเปลี่ยน cursor เป็นรูปการ์ตูนน่ารัก ๆ

posted on 04 Feb 2007 23:07 by jennessa in Design

กลับมาแล้ว หลังจากบอลแพ้ T T

วันนี้มาเปลี่ยน cursor กันค่ะ วิธีการเปลี่ยน cursor เป็นรูปอื่น ๆ นะคะ ไม่ยากเลย มีวิธีทำดังนี้ค่ะ

1. หารูปที่จะนำมาเป็น cursor ก่อนค่ะ ไฟล์รูปที่จะนำมาเป็น cursor ที่เรารู้ก็มีอยู่สองนามสกุลคือ .cur กับ .ani นะคะ

2. คำถาม? จะหา cursor ได้จากที่ไหน? ที่เจนเนสซ่าไปหาบ่อย ๆ ก็ที่เดิมค่ะที่ Bloggang หมวด การตกแต่งบลอค มี blogger มาแจก cursor อยู่มากมายเลยค่ะ เข้าไปเลือกมาซักอันนึง เมื่อเลือกได้แล้ว ให้ copy url ของ cursor ไว้ค่ะ ตัวอย่าง url ของ cursor ที่เราเลือกไว้ ดังข้างล่าง

http://www.boomspeed.com/sfhelpers/cursors/89.cur

3. จากนั้นกลับมาที่ exteen ไปที่ Theme --> แก้ CSS ด้วยตัวเอง แล้วเพิ่มโค้ดข้างล่างต่อท้ายใน CSS ค่ะ copy ไปเลยยย

body { cursor:url(<url ของรูปที่จะนำมาเป็น cursor>); }

a { cursor:url(<url ของรูปที่จะนำมาเป็น cursor>); }

ตรงที่ไฮไลท์ ให้ใส่ url ของรูปที่จะนำมาเป็น cursor นะคะ อย่างของเจนเนสซ่าก็จะเป็น

body { cursor:url(http://www.boomspeed.com/sfhelpers/cursors/89.cur); }

a { cursor:url(http://www.boomspeed.com/sfhelpers/cursors/89.cur); }

4. ใน body คือกำหนดว่า ในหน้าเวบของเราให้ใช้ cursor รูปนี้ ส่วนใน a คือกำหนดว่า เมื่อเอาเมาส์ไปชี้ที่ลิงค์แล้ว จะให้ cursor เป็นรูปนี้ ทั้งสองที่ไม่จำเป็นต้องใช้รูปอันเดียวกันก็ได้นะคะ หรือถ้าอยากให้เอาเมาส์ไปชี้ที่ลิงค์แล้วเป็นรูปมือเหมือนเดิม ก็ไม่ต้องเพิ่ม a { cursor:url(...); } ลงใน CSS ของเราค่ะ

5. เสร็จแล้ว เมาส์ของเจนเนสซ่าก็เลยเปลี่ยนไปแล้ว สอนอะไรก็เปลี่ยนเป็นอย่างนั้น:D มีคำถามก็คอมเมนต์ไว้เหมือนเดิมนะคะ (^ ^)V

ขอบคุณรูป cursor น่ารัก ๆ จาก uggie's blogค่ะ

ปล. สำหรับคนที่ใช้ Firefox เป็น browser จะมองไม่เห็นนะคะ

Tags: css, cursor42 Comments

เย้ เจนเนสซ่าใจดีจังเลย ขอบคุณมากนะคะ
แล้ว Tag คืออะไรเหรอคะ เล่นม่าเป็น??

#1 By Amilin on 2007-02-05 00:31

จะลองทำดูนะครับ

#2 By ลอท on 2007-02-05 00:51

จะลองทำดูค่ะ
ขอบคุณมากนะคะ

#3 By eeddy(อี๊ด) on 2007-02-05 09:31

โอ้ ขอบคุณมากๆนะคะ

#4 By maebin on 2007-02-05 14:03

ได้ไปหลายทิปแล้วว

แต่ยังไม่ได้เอาไปใช้ซะทีอะ อิอิ

#5 By worapoj@~@ on 2007-02-05 20:49

ขอบคุณที่แนะนำครับ แล้วจะลองหาภาพถูกใจมาลองลงดูบ้าง

#6 By นายบวก on 2007-02-05 22:40

น่าสนใจดีจัง ขอแอดเปน favourite นะ

#7 By ~~ NiKung ^_^ on 2007-02-06 00:37

#8 By ~~ NiKung ^_^ on 2007-02-06 00:37

เป็นคนที่น่ารักมีน้ำใจจังเลย นี้หละเขาถึงเรียกว่าคนไทย ....!....

....

.....

#9 By ☆═ ท้องฟ้า สีชมพู่═☆ on 2007-02-06 04:28

โทษ นะเราเอารูปภาพไว้หน้าหัวข้อไม่ได้อะ เราทำตามเธอแล้วแต่มันไม่ขึ้นอะ เพราะอะไรไม่รู้

#10 By on 2007-02-12 13:00

ตอบคุณ @@@seed@@@ มันขึ้นเป็นกากบาทรึป่าวคะ ถ้าขึ้นเป็นกากบาทแสดงว่า URL ผิด ต้องไปเอา URL รูปมาใหม่ แต่ถ้าไม่ขึ้นอะไรเลยแสดงว่าอาจจะใส่ที่ผิด

ลองเอา URL รูปใส่ใน address bar แล้ว enter เพื่อดูว่ารูปขึ้นรึป่าวค่ะ ถ้ารูปไม่ขึ้นแสดงว่า URL ผิด ต้องเอา URL มาใหม่นะคะ

ถ้าแก้ไม่ได้จริง ๆ โพสท์ CSS ตรงส่วน
.sidebar-item li ไว้ค่ะ เด๋วตามไปดูให้ค่ะ