เฟรม (Frame) เป็นการจัดแบ่งหน้าต่างของเว็บเพจออกเป็นส่วน ๆ เพื่อให้แต่ละส่วนแสดงเว็บเพจที่แตกต่างกันตามที่เรากำหนด
เฟรม (Frame ) และเฟรมเซ็ต (Frameset)
เฟรม Frame เป็นพื้นที่ส่วนหนึ่งของหน้าเว็บเพจที่ถูกเราจัดแบ่งไว้เพื่อให้แสดงเว็บเพจ ได้อย่างอิสระโดยไม่ขึ้นกับส่วนอื่น ๆ โดยโครงร่างและรายละเอียดในการจัดแบ่งเฟรม เช่น จำนวนเฟรม ขนาด ตำแหน่งของเฟรม และชื่อเว็บเพจที่เริ่มต้นแสดงในแต่ละเฟรมจะถูกจัดเก็บไว้เป็นไฟล์ HTML ที่เรียกว่า เฟรมเซ็ต Frameset
การสร้างเฟรม
เราสามารถที่จะสร้างเฟรมได้ 2 ทางคือ สร้างขึ้นเองตามแบบที่เราต้องการ หรือเลือกจากแบบสำเร็จที่โปรแกรมจัดเตรียมไว้ให้ โดยสามารถสร้างจากไฟล์ Web page ที่สร้างไว้แล้ว หรือสร้างจากไฟล์ที่สร้างใหม่
วิธีที่ 1
วิธีที่ 2
1. เลือกเมนูคำสั่ง File เลือกคำสั่ง New จะปรากฏหน้าต่าง New Document
2. เลือก Page from Sample ในส่วนของ Sample Folder เลือก Frameset
3. จากนั้นทำการทำการเลือก Sample Page จากรายการที่แสดง โดยโปรแกรมจะแสดงตัวอย่างทางด้านขวามือดังรูป
4. เมื่อเลือก Frameset จากรายการเรียบร้อยแล้วให้คลิกที่ปุ่ม
- การสร้างเฟรม
- สร้างเว็บเพจใหม่
- เลือกเมนูคำสั่ง Modify เลือก Framesset
- จากนั้นเลือกรูปแบบที่ต้องการ
การแบ่งเฟรมย่อย
คลิกที่เมนูคำสั่ง View เลือกคำสั่ง Visual Aids เลือกคำสั่ง Frame Borders เพื่อกำหนดให้มีเส้นขอบของเฟรมที่ถูกเลือกไว้ก่อนหน้านี้
-
นำเมาส์คลิกค้างไว้ที่เส้นขอบของเฟรม (Frame Borders)
- ดรากส์เมาส์ลากเส้นขอบของเฟรมออกมาตามที่ต้องการ
- หากต้องการแบ่งเฟรมออกเป็น 4 เฟรมให้นำเมาส์ดรากส์ลากจากมุมของเฟรม จะเห็นว่าหัวของ ตัวชี้เมาส์ (Pointer)
จะเป็นรูป
- เลือกคำสั่ง Window>>Frames เพื่อเปิดหน้าต่างเฟรมออกมา เพื่อช่วยในการแบ่งเฟรม
คลิกเมาส์ลากแบ่งเฟรมย่อยออกมา
เมื่อสร้างเฟรมขึ้นเองโดยไม่ใช้เฟรมสำเร็จรูปก็ต้องทำการปรับแต่งขนาด และแบบของเฟรมที่สร้างด้วยตนเองเพื่อให้ได้
โครงสร้างตามที่ต้องการ สำหรับการปรับแต่งเฟรมมีรายละเอียดแบ่งเป็นหัวข้อได้ดังตัวอย่างต่อไปนี้
เราสามารถปรับขนาดของเฟรมเพื่อให้ได้เฟรมที่มีขนาดตามต้องการด้วยวิธีการแดรกเมาส์ค้างไว้ที่เส้นแบ่งเฟรมแล้วลากไป
ยังจุดที่กำหนดทั้งในแนวตั้ง หรือแนวนอน ซึ่งทำได้ดังนี้
เมื่อแบ่งเฟรมด้วยตนเองแล้วยังเพิ่มเฟรมย่อยจากเฟรมที่สร้างขึ้นเดิมได้โดยการไปที่คำสั่ง Modify >>Frameset จากนั้นเลือกวิธี
การเพิ่มเฟรมจาก Split Frame แบบต่างๆ โดยสามารถแบ่งเฟรมทั้งแนวตั้งหรือแนวนอนซึ่งทำได้ดังนี้
- Split Frame Left แสดงเฟรมหลักทางซ้าย
- Split Frame Right แสดงเฟรมหลักทางขวา
- Split Frame Up แสดงเฟรมหลักด้านบน
- Split Frame Down แสดงเฟรมหลักด้านล่าง
การลบเฟรมย่อย
บางครั้งเฟรมที่สร้างขึ้นมาอาจไม่ได้ใช้งานหรือไม่เป็นตามต้องการ ก็อาจจะลบเฟรมนั้นออกได้ดังนี้
- แดรกเมาส์ตรงเส้นแบ่งเฟรมที่ไม่ต้องการ และต้องการลบออกจากหน้าเว็บเพจ
- จากนั้นลากไปหาขอบเว็บเพจโดยเส้นเฟรมแนวตั้งให้ลากไปที่ขอบด้านซ้ายส่วนเส้นแนวนอนให้ลากไปที่ขอบด้านบน
การปรับแต่งคุณสมบัติของ เฟรม
- เลือกเฟรมที่ต้องการ
- ปรับค่าต่าง ๆ ในพาเนล properties
1. เลือกเฟรมที่ต้องการจะเปลี่ยนสีพื้นหลัง
2. คลิกที่เมนูคำสั่ง Modify เลือกคำสั่ง Page Properties
3. จะปรากฏหน้าต่าง Page Properties ขึ้นมาให้ปรับตั้งค่าต่าง ๆ
4. คลิกเมาส์ที่ Background จะปรากฏหน้าต่างให้เลือกสีตามต้องการ
5. จากนั้นคลิกที่ปุ่ม OK เฟรมจะเปลี่ยนเป็นสีตามที่เลือกไว้
1. เลือกเฟรมที่ต้องการจะเปลี่ยนพื้นหลังเป็นรูปภาพ
2. คลิกที่เมนูคำสั่ง Modify เลือกคำสั่ง Page Properties
3. จะปรากฏหน้าต่าง Page Properties ขึ้นมาให้ปรับตั้งค่าต่าง ๆ
4. คลิกเมาส์ที่ Browse จะปรากฏหน้าต่างให้เลือก
5. คลิกที่ปุ่ม OK เฟรมจะเปลี่ยนเป็นรูปภาพตามที่เราเลือก
1. เลือกเฟรมเซ็ตที่ต้องการ โดยคลิกที่เส้นแบ่งเฟรมเพื่อเลือกเฟรมเซ็ตของชุดเฟรมนั้น ๆ
2. จะปรากฏพาเนล Properties ของเฟรมเซ็ตขึ้นมาให้ทำการปรับตั้งค่า
การปรับขนาดเฟรม
- คลิกที่แท็บที่อยู่ขอบด้านซ้ายเพื่อเลือกปรับขนาดในแนว Row หรือ คลิกที่แท็บที่อยู่ขอบด้านบนเพื่อ
เลือกปรับขนาดในแนว Column
2. กำหนดขนาดของเฟรมโดยใส่ค่าในช่อง Value
การเชื่อมโยงข้อมูลภายในเฟรม
1. เลือกข้อความหรือรูปภาพในเฟรมที่จะใช้เป็นจุดเชื่อมโยง
2. ในส่วนของ Link ในพาเนล Properties ให้กำหนดไฟล์ที่จะเชื่อมโยงไปถึง
3. คลิกที่ เพื่อเลือกไฟล์ที่ต้องการเชื่อมโยงไปถึง
4. เมื่อเลือกข้อความหรือรูปภาพเป็นจุดเชื่อมโยงเรียบร้อยแล้ว จะปรากฏดังนี้
5. เลือกส่วนของ Target เพื่อเลือกเฟรมที่จะใช้แสดงเว็บเพจนั้น
โดยเลือกรูปแบบดังนี้
_bank เปิดไฟล์ในหน้าต่างใหม่
_parent เปิดไฟล์ในเฟรมหลักหรือหน้าหลักที่จุดเชื่อมโยงอยู่
_self เปิดไฟล์ในเฟรมหรือหน้าต่างเดียวกับจุดเชื่อมโยงอยู่
_top เปิดไฟล์นั้นในแบบเต็มจอโดยยกเลิกเฟรมทั้งหมด
เราสามารถกำหนด Target เพิ่มได้โดยวิธีการดังนี้
1. คลิกเลือกเฟรมให้มีจุดไข่ปลาล้อมรอบ
2. กำหนดชื่อในช่อง Frame name
3. ในส่วนของ Target จะเพิ่มชื่อ Frame name เข้ามาให้เลือกกำหนด เป้าหมายมากขึ้นตามที่เราต้องการ
4. ให้เลือก Target ที่ต้องการแล้วกดปุ่ม F12 เพื่อทดสอบดูผลในหน้า Preview in Browser
เมื่ออยู่ในมุมมอง Design ของหน้าต่าง Document การคลิกภายในเฟรมเพื่อวางตัวบอกตำแหน่งการพิมพ์จะไม่ถือว่าเป็นการเลือกเฟรม ซึ่งการเลือกเฟรมจะต้องกระทำดังนี้
กดปุ่ม Alt ค้างไว้แล้วคลิกภายในเฟรมเพื่อเลือกนั้น หรือ คลิกที่เส้นแบ่งเฟรมเพื่อเลือกเฟรมเซ็ต
เฟรมที่ถูกเลือกจะแสดงเส้นขอบเฟรมนั้นด้วยเส้นไข่ปลา และเมื่อเลือกเฟรมเซ็ต เส้นแบ่งเฟรมทุกเส้นก็จะแสดงด้วยเส้นไข่ปลา ส่วน Panel ของ Properties ก็จะแสดงค่าต่างๆ ของเฟรมและเฟรมเซ็ตตามที่เราเลือกเพื่อให้เราสามารถปรับค่าต่างๆ ได้โดยสะดวก
การสร้างเนื้อหาลงในเฟรม
ในการสร้างเนื้อหาลงในเฟรมนั้น เราอาจทำการสร้างขึ้นใหม่โดยการพิมพ์เนื้อหาลงไปโดยตรงแล้วทำการบันทึกเฟรมที่สร้างเนื้อหาลง หรือเปิดใช้ไฟล์เว็บเพจที่เราสร้างไว้แล้วก็ได้
การเปิดใช้ไฟล์เว็บเพจที่สร้างไว้แล้วจะกระทำได้โดย
1. คลิกเมาส์ภายในเฟรมที่ต้องการนำไฟล์เว็บเพจที่สร้างไว้แล้วมาใช้งาน
2. เลือกเมนูคำสั่ง File เลือกคำสั่ง Open in Frame
3. เลือกไฟล์เว็บเพจที่ต้องการ จากนั้นคลิกที่ปุ่ม OK
การบันทึกเฟรมและเฟรมเซ็ต
การบันทึกเฟรมเซ็ต
1. คลิกที่เส้นแบ่งขอบของเฟรมเพื่อเป็นการเลือกเฟรมเซ็ต จะสังเกตว่ามีเส้นไขปลาอยู่ที่ เส้นขอบของทุกเฟรม
2. เลือกเมนูคำสั่ง File เลือกคำสั่ง Save Frameset หรือ Save Frameset As
3. จะปรากฏหน้าต่าง Save as ให้เราตั้งชื่อ Frame set ในช่อง File nameจากนั้นคลิกที่ปุ่ม Save
การบันทึกเนื้อหาภายในเฟรม
1. คลิกเลือกเฟรมที่ต้องการ
2. เลือกเมนูคำสั่ง File เลือกคำสั่ง Save Frame หรือ Save Frame As
3. จะปรากฏหน้าต่าง Save As ให้เราตั้งชื่อ Frame ในช่อง File Name จากนั้นคลิกที่ปุ่ม Save
|