|
บทที่ 20
Rollover
Rollover
Image
เป็นเทคนิคที่ใช้กันแพร่หลายให้ทั้งความสวยงามและความตื่นตาตื่นใจกับผู้ชมได้เป็นอย่างดี
ในสมัยก่อนต้องมีความรู้ด้านภาษา JavaScript ถึงจะทำได้ แต่ด้วยความสามารถของ
Dreamweaver ช่วยให้ผู้ที่ไม่รู้ภาษา JavaScript ก็สามารถเพิ่มลูกเล่นนี้เข้าไปได
้
ขั้นตอนการทำ
คลิก Cursor ให้อยู่ในตำแหน่งที่ต้องใส่ Rollover Image
กดปุ่ม Rollover ใน Object palette หรือที่เมนู Insert > Rollover
Image
จะมี Dialog box ขึ้นมาให้ใส่ค่าดังนี้
Image Name ใส่ชื่อถ้าไม่ใส่ทางโปรแกรมจะกำหนดให้เป็น Image1 ,2,3,4
Original Image ให้คลิกรูปจาก Browser แล้วเลือกรูปที่ต้องการ (
เป็นรูปที่กำหนดให้เป็นปุ่มก่อนที่เม้าส์จะลากผ่าน
Rollover Image ให้คลิกรูปจาก Browser แล้วเลือกรูปที่ต้องการ (
เป็นรูปที่กำหนดให้เป็นปุ่มเวลาที่ลากเม้าส์ผ่าน
ใส่เครื่องหมายถูกหน้า Preload Rollover Image ( เพื่อเป็นการ Load
รูปภาพล่วงหน้าเพื่อให้การทำงานของ Rollover เป็นไป อย่างราบรื่น
)
When Clicked, Go To URL ใส่ลิ้งค์ที่ต้องการให้เรียกขึ้นมาหลังจากที่คลิกปุ่มแล้ว
หลังจากเรียบร้อย คลิก OK แล้วจากนั้นให้ทำงานการทดสอบดูใน Browser
โดยการกดปุ่ม F12 เมื่อ Browser เปิดขึ้นมาให้ลอง เลื่อนเมาส์ผ่านรูปดู
|
