%E0%B8%81%E0%B8%B2%E0%B8%A3%E0%B8%97%E0%B8%B3 Rollover Image %28%E0%B9%80%E0%B8%9B%E0%B8%A5%E0%B8%B5%E0%B9%88%E0%B8%A2%E0%B8%99%E0%B8%A3%E0%B8%B9%E0%B8%9B%E0%B8%A0%E0%B8%B2%E0%B8%9E%E0%B9%80%E0%B8%A1%E0%B8%B7%E0%B9%88%E0%B8%AD MouseOver%29 [Article ID : 109]

ก่อนที่จะไปทำ Rollover Image นั้น ในเบื้องต้นเราต้องทำการจัดเตรียมไฟล์รูปภาพไว้จำนวน 2 ไฟล์ก่อนครับ เมื่อมีไฟล์รูปภาพแล้ว จากนั้นทำตามขั้นตอนต่างๆ ดังนี้

1. นำ Cursor ไปวางไว้ยังตำแหน่งหน้าเว็บพจที่ต้องการให้แสดง Rollover Image
2. จากนั้นไปที่ Insert -> Common แล้วเลือกที่ Image : Rollover Image ดังรูป
3. เมื่อเลือกดังข้อ 2 แล้ว โปรแกรมจะเปิดหน้าต่างขึ้นมาเพื่อให้เรากำหนดค่าต่าง ๆ ดังรูป ที่หน้าต่าง Insert Rollover Image ให้ทำการกำหนดค่า ดังนี้
- Image name : Image1 *หรือชื่ออื่นตามต้องการ
- Original image : เลือกรูปภาพที่จะแสดงก่อนมีเมาท์มาวางเหนือ
- Rollover image : เลือกรูปภาพที่จะแสดงเมื่อมีเมาท์มาวางเหนือ
- Alternate text : พิมพ์ข้อความอธิบายรูปภาพ
- When clicked, Go to URL : เลือกไฟล์ หรือ URL ที่จะทำการ Link ไปเมื่อมีการกดที่รูปภาพ

4. เมื่อกำหนดค่าที่หน้าต่างในข้อ 3 ได้แล้วกดที่ OK เราก็จะได้รูปที่มี action เป็นแบบ Rollover Image ครับ ดังรูป 5. ทำการพรีวิวดูผลกับ Web Browser โดยการกดปุ่ม F12 ที่คีย์บอร์ด