การสร้างเฟรมเซตในเว็บเพจ

การสร้างเฟรมเซต

เฟรม คือ ลักษณะของการแบ่งพื้นที่หน้าต่างหลัก ของบราวเซอร์ออกเป็นส่วนย่อย ๆ เพื่อใช้สำหรับแสดงเว็บเพจให้แต่ละส่วนแยกจากกันอย่างอิสระ วิธีการแบ่งเฟรม ไปที่ แถบ Frames คลิกเลือกรูปแบบเฟรมตามที่ได้ออกแบบ

กำหนดรายละเอียดหน้าต่าง Properties

 Borders กำหนดให้แสดง (Yes) / ไม่แสดง (No) ขอบล้อมเฟรม (Default คือ Yes)

 Border Width กำหนดความหนาของเฟรม ถ้าไม่ต้องการแสดงขอบเฟรม กำหนดค่านี้เป็น 0
 Border Color กำหนดสีของขอบเฟรม
 Column (or Row) and Units กำหนดขนาดของคอลัมน์ หรือความสูงของเฟรม โดยให้เราระบุหน่วยที่ใช้ในช่อง Units
 Pixels หน่วย pixel แม่นยำที่สุด ในการกำหนดขนาด
 Percent หน่วยเปอร์เซ็นต์กับเฟรมอื่นในหน้าต่าง
 Relative หน่วยเปอร์เซ็นต์กับขนาดหน้าต่างบราวเซอร์

รายละเอียดแถบ Properties ของหน้าเว็บในเฟรมย่อย แถบ ของ Panel Group ด้านขวามือของโปรแกรมจะมี เครื่องมือ Advanced Layout ? คลิกเลือกแถบเฟรม ? คลิกส่วนใดส่วนหนึ่งของเฟรม

ปรากฏรายละเอียด หน้าต่าง Properties ของหน้าเว็บในเฟรมย่อย

Frame Name

ตั้งชื่อที่ใช้เรียกเฟรมย่อย ซึ่งต้องอ้างถึงชื่อเฟรม เมื่อมีการเชื่อมโยงกับเฟรมให้ใช้ตัวอักขระเล็กในการตั้งชื่อ
Src
ให้กำหนดชื่อและตำแหน่งเก็บไฟล์เว็บเพจที่จะถูกนำมาใช้ในเฟรม
Borders
กำหนดให้แสดง (Yes) / ไม่แสดง (No) ขอบล้อมเฟรมย่อย (Default คือ Yes)
Scroll
กำหนดให้แสดง (Yes) / ไม่แสดง (No) แถบเลื่อน (Scroll bar) ในเฟรมย่อยAutoให้แสดงแถบเลื่อนเฉพาะ เมื่อมีข้อมูลเกินกว่าที่จะแสดงได้บนหน้าจอ (Default คือ Auto)
No Resize
สั่งให้แสดงขอบเฟรมย่อย หากไม่ต้องการให้มีการใช้เมาส ์ปรับขนาดเฟรมให้เช็คถูกหน้าข้อความนี้
Border Color
กำหนดสีขอบเฟรม
Margin Width Margin Height
กำหนดระยะห่างระหว่างหน้าเว็บในเฟรมย่อยกับขอบเฟรม โดย Margin Width จะวัดจากด้านซ้ายของเฟรม Margin Height จะวัดจากด้านบนของเฟรม

การแทรกเว็บเพจลงในเฟรม

1. เปิดหน้าต่างเฟรมโดยเลือกคำสั่ง Window -->Others --> Frames หรือ กด Shift + F2
2. Click เลือกส่วนของเฟรมที่ต้องการจะแทรกเว็บเพจ
3. Click ที่รูปโฟล์เดอร์ เพื่อเลือกไฟล์เว็บเพจที่ต้องการแทรก
4. เลือกไฟล์ที่ต้องการแทรก ปรากฏหน้าเว็บเพจในเฟรมที่ถูกเลือกไว้

การบันทึกเฟรมย่อย


1. เลือกคำสั่ง File>Save All หรือกดคีย์ คือการบันทึกทุกไฟล์ที่ประกอบเป็นหน้าเว็บเฟรม
2. โปรแกรมจะถามให้บันทึกหน้าต่อไป ซึ่งจะปรากฏเส้นประ รอบ ๆ เฟรมย่อย โดยจะบันทึกจากด้าน ขวาล่าง? ซ้ายล่าง ? ขวาบน ? ซ้ายบน จนครบทุกเฟรมย่อม (ควรต้องชื่อให้เหมาะกับตำแหน่งเฟรม)
หากมีการแก้ไขหรือเปลี่ยนแปลงทุกครั้งต้อง ใช้คำสั่งบันทึก File > Save All Frames

การเชื่อมโยงหน้าเว็บในเฟรม


1. ลากเมาส์เลือกข้อความที่ต้องกำหนดเป็น Link
2. Click mouse ปุ่ม เพื่อเลือกไฟล์ที่จะเชื่อมโยงด้วยในแถบ Properties
3. เลือกไฟล์ที่ต้องการเชื่อมโยงด้วยแล้ว Click ปุ่ม selete
4. กำหนดรูปแบบการแสดงผลบนเฟรมจากช่อง Target ในแถบ Properties ตัวอย่างเราเลือก Main Frame คือ เฟรมที่อยู่ด้านขาวมือ

• _blank เปิดเพจใหม่ขึ้นมา
• _parent แสดงเพจหน้าเดิม โดยจะลบเฟรมออก
• _self แสดงในเฟรมเดียวกันกับที่มีข้อความอยู่
• _top ขยายเต็มหน้าจอ

รูปแบบที่เพิ่มมาจากการเชื่อมโยงปกติ คือ


• mainFrame แสดงเพจใหม่ในหน้า mainframe
• topFrame แสดงเพจใหม่ในหน้า topFrame
• leftFrame แสดงเพจใหม่ในหน้า leftFrame

5. เซฟแล้วตรวจสอบผ่านบราวเซอร์ เมื่อ Click ที่ Link หน้าเว็บเพจที่สามารถเชื่อมโยงได้ จะถูกแสดงในส่วนเฟรมที่กำหนดไว้