Dreamweaver (ต่อไปนี้จะเรียกว่า DW) มีกลไกที่เรียกว่า "พฤติกรรม" เพื่อช่วยคุณสร้างพฤติกรรมแบบโต้ตอบในเพจ พฤติกรรมคือชุดของการกระทำที่ทำบนหน้าเว็บ ซึ่งผู้ใช้โต้ตอบกับหน้านั้น การใช้พฤติกรรมของ DW ช่วยให้คุณได้รับเอฟเฟกต์เพจไดนามิกที่หลากหลาย และบรรลุการโต้ตอบระหว่างผู้ใช้กับเพจโดยไม่ต้องเขียนโค้ดแม้แต่บรรทัดเดียว
พฤติกรรมประกอบด้วยเหตุการณ์และการกระทำ เหตุการณ์คือผลลัพธ์ของการกระทำที่ถูกทริกเกอร์ และการกระทำนั้นเป็นโค้ด JavaScript ที่เขียนไว้ล่วงหน้าซึ่งใช้เพื่อทำงานเฉพาะเจาะจงให้เสร็จสิ้น เช่น การเปิดหน้าต่างเบราว์เซอร์ การเล่นเสียง ฯลฯ
เมื่อใช้ลักษณะการทำงานกับองค์ประกอบของหน้า คุณจะต้องระบุการกระทำและเหตุการณ์ที่จะทริกเกอร์ DW ได้จัดเตรียมการดำเนินการบางอย่างที่คุณสามารถนำไปใช้กับองค์ประกอบของหน้าได้
1. ลักษณะการทำงานพื้นฐานบางอย่างในตัว
1. การเรียก JavaScript (การเรียก JavaScript)
ลักษณะการทำงานนี้ช่วยให้คุณสามารถตั้งค่าสคริปต์ JavaScript ที่เกี่ยวข้องให้ถูกเรียกเมื่อมีเหตุการณ์บางอย่างถูกทริกเกอร์เพื่อใช้การกระทำที่เกี่ยวข้อง เมื่อตั้งค่าลักษณะการทำงานนี้ คุณสามารถป้อนสคริปต์หรือฟังก์ชัน JavaScript ได้โดยตรง
2. เปลี่ยนคุณสมบัติ (เปลี่ยนคุณสมบัติ)
พฤติกรรมนี้ช่วยให้คุณเปลี่ยนคุณสมบัติของวัตถุแบบไดนามิก เช่น ขนาดของรูปภาพ สีพื้นหลังของเลเยอร์ เป็นต้น โปรดทราบว่าการตั้งค่าลักษณะการทำงานนี้ขึ้นอยู่กับการรองรับเบราว์เซอร์
3. ตรวจสอบเบราว์เซอร์
ความสามารถในการรองรับของเบราว์เซอร์ต่างๆ มีความแตกต่างบางประการ เมื่อใช้ลักษณะการทำงานนี้ เราสามารถตรวจสอบเวอร์ชันของเบราว์เซอร์เพื่อข้ามไปยังหน้าต่างๆ ได้
4. ตรวจสอบปลั๊กอิน
บางครั้งหน้าเว็บที่เราสร้างจำเป็นต้องรองรับปลั๊กอินบางตัว เช่น หน้าเว็บที่สร้างโดยใช้ Flash ดังนั้นจึงจำเป็นต้องตรวจสอบปลั๊กอินของเบราว์เซอร์ของผู้ใช้เพื่อดูว่ามีปลั๊กอินที่ระบุหรือไม่ ติดตั้งแล้ว พฤติกรรมนี้ทำอย่างนั้น
5. Control Shockwave หรือ Flash (Control Shockwave หรือ Flash)
Shockwave และ Flash เป็นวัตถุที่มักถูกแทรกลงในการผลิตหน้าเว็บปัจจุบัน ลักษณะการทำงานนี้ใช้เพื่อควบคุมวัตถุเหล่านี้ คุณสามารถใช้มันเพื่อควบคุมการเล่น หยุด และการย้อนกลับของภาพเคลื่อนไหว และคุณยังสามารถควบคุมเฟรมที่จะข้ามไปโดยตรงได้อีกด้วย
6. ย้ายเลเยอร์ (Drag Layer)
พฤติกรรม "ย้ายเลเยอร์" สามารถรับรู้ถึงความเคลื่อนไหวของเลเยอร์บนเพจ และแม้กระทั่งการเคลื่อนไหวของเนื้อหาที่เลเยอร์
7. ข้ามไปที่ URL (ไปที่ URL)
คุณสามารถระบุหน้าต่างเบราว์เซอร์ปัจจุบันหรือหน้าต่างเฟรมที่ระบุเพื่อโหลดหน้าเว็บที่ระบุ
8. Jump Menu
ลักษณะการทำงานของ "Jump Menu" ส่วนใหญ่จะใช้สำหรับการแก้ไขแบบฟอร์มการข้าม
9. กล่องโต้ตอบข้อความป๊อปอัป (Popup Message)
หากคุณต้องการแสดงกล่องโต้ตอบข้อมูลบนเพจ หรือให้ข้อความแจ้งเตือนแก่ผู้ใช้ คุณสามารถใช้ลักษณะการทำงานนี้ได้
2. ตัวอย่างง่ายๆ
ด้านล่างเราจะถ่ายภาพไดนามิกเป็นตัวอย่างเพื่อแนะนำการใช้พฤติกรรม ก่อนอื่นคุณต้องสร้างรูปภาพสองรูปที่ 1 และ 2 ที่มีขนาดเท่ากัน ต่อไปนี้เป็นขั้นตอนเฉพาะ
1. เปิด DW เพื่อสร้างหน้าและแทรกรูปที่ 1 ลงในหน้านี้
2. เลือกรูปที่ 1 ในหน้าต่างแก้ไข DW
3. เลือก "พฤติกรรม" ในเมนู "windows" หรือกด F8 เพื่อเปิดแผงพฤติกรรม โปรดทราบว่าในเมนูป๊อปอัปเหตุการณ์สำหรับ ควรเลือก "เบราว์เซอร์ 3.0 และใหม่กว่า"
4. กดปุ่ม "+" เพื่อเพิ่มลักษณะการทำงานใหม่ - "สลับรูปภาพ" และกล่องโต้ตอบ "สลับรูปภาพ" จะปรากฏขึ้น ในรายการรูปภาพ คุณจะเห็นรายการรูปภาพทั้งหมดบนหน้า เลือกรูปภาพ 1 ที่คุณต้องการแปลง นี่คือรูปภาพต้นฉบับ เมื่อเลื่อนเมาส์ไปเหนือรูปภาพนั้นจะถูกแทนที่ด้วยรูปภาพ 2 ที่ไฮไลต์ ทดแทน.
5. คลิกปุ่มเรียกดูและเลือกรูปภาพที่คุณต้องการแทนที่ รูปภาพ 2 ที่เลือกจะแทนที่รูปภาพต้นฉบับ 1 ผ่านเหตุการณ์ "onMouseOver"
6. เลือกการตั้งค่าเริ่มต้นสำหรับการโทรล่วงหน้าและการจัดเก็บรูปภาพ
ตัวเลือก "โหลดรูปภาพล่วงหน้า" หมายความว่าเมื่อดาวน์โหลดทั้งหน้า ภาพที่แปลงแล้วจะถูกวางไว้ในแคชของเบราว์เซอร์ เมื่อผู้ดูเลื่อนตัวชี้เมาส์ไปเหนือรูปภาพเรื่องราวของเราเป็นครั้งแรก เขาแทบจะไม่รู้สึกถึงภาพที่ไฮไลต์เลย ไม่มีความล่าช้าในการปรากฏตัวของ ตัวเลือก "กู้คืนรูปภาพ onMouseOut" หมายความว่าเมื่อมีเหตุการณ์ "onMouseOut" (เลื่อนเมาส์ออก) เกิดขึ้น รูปภาพจะถูกเรียกคืนสู่สถานะดั้งเดิมโดยอัตโนมัติ
7. หลังจากการตั้งค่าเสร็จสิ้น ให้คลิกปุ่ม "ตกลง" เพื่อปิดกล่องโต้ตอบ "สลับรูปภาพ" และใช้การตั้งค่าก่อนหน้า
ในขณะนี้ แผงพฤติกรรมประกอบด้วยเหตุการณ์และการดำเนินการที่คุณเพิ่งตั้งค่าไว้สำหรับรูปภาพ มีเครื่องหมายการกระทำ "Swap Image" ถัดจากเหตุการณ์ "OnMouseOver" และด้านบนมีเหตุการณ์ "onMouseOut" และการดำเนินการ "Swap Image Restore" ที่เกี่ยวข้อง (ลักษณะการทำงานนี้คือเมื่อคุณยอมรับค่าเริ่มต้นในกล่องโต้ตอบ Swap Image ตัวเลือกกล่องที่กำหนดไว้)
8. ปิดแผงพฤติกรรม กด F12 เพื่อดูตัวอย่างหน้า เมื่อคุณเลื่อนตัวชี้เมาส์ไปที่ภาพที่ 1 คุณจะพบว่าถูกแทนที่ด้วยภาพที่ 2
ตัวอย่างข้างต้นเป็นเพียงตัวอย่างการใช้งานง่ายๆ ของพฤติกรรมของ DW มีประโยชน์อื่นๆ อีกมากมาย ดังนั้นฉันจะไม่อธิบายทีละรายการที่นี่ นอกจากนี้ DW ยังอนุญาตให้ผู้ใช้ใช้ลักษณะการทำงานเพิ่มเติม ซึ่งสามารถดาวน์โหลดได้จากหน้าแรกของ Macromedia