ถัดไป ก่อนหน้า

3.2 Toolbars

     a. Toolbar basics
   Toolbar จะใช้ในส่วนของ header และ footer โดยมีscrollของเพจตามค่าเริ่มต้น แต่สามารถ fixตำแหน่ง และใช้ toolbar persistent เข้ามาช่วยในเรื่องการส่งข้ามเพจได้ นอกจากนี้ยังสามารถใส่ component navbar ได้ใน toolbar หรือในเนื้อหาของเพจ
Toolbar types
   ลักษณะของ Toolbarมีลักษณะมาตรฐาน อยู่ 2 ลักษณะ คือ Header และ Footer

• ในส่วน Header bar
     มีหน้าที่เป็น title ของเพจ มักจะเป็นส่วนแรกของเพจ ซึ่งจะมี title และอีก 2 ปุ่ม แสดงอยู่
• ในส่วน Footer bar
     มักจะเป็นส่วนสุดท้ายของเพจ ซึ่งจะอิสระกว่าในส่วนของ Header bar ในแง่ของเนื้อหา และการทำงาน แต่มักจะมีกลุ่มของtext และ button แสดงอยู่

   หากใน header หรือ footer มีการเรียกใช้ navbar จะเปลี่ยนลิงค์ที่เป็น listเรียงลงมา ให้เป็นปุ่มในแนวนอนซึ่งจะทำให้ทำงานได้ดีขึ้น และสามารถดู attribute ที่เพิ่มลงใน toolbar ได้เพิ่มเติมใน data- attribute reference

Toolbar positioning options
   การเลือกตำแหน่งของToolbar
header และ footer จะมีตำแหน่งให้เลือกน้อย ซึ่งในค่าเริ่มต้นของ toolbar จะใช้โหมด "inline" positioning โดยโหมดนี้จะทำให้ header และ footer สามารถมองเห็นได้ในทุกๆอุปกรณ์ โดยไม่คำนึงถึง JavaScript และ CSS

• โหมด "fixed" positioning
     จะเป็นการ fix toolbar ไว้ด้านบนสุดและล่างสุดของเบราว์เซอร์ ที่สนับสนุนการfixตำแหน่งของcss ซึ่งรวมถึง desktop browsers ส่วนใหญ่ ,iOS5 +, Android 2.2 +, BlackBerry เป็นต้น ส่วนในเบราว์เซอร์ที่ไม่สนับสนุนการfixตำแหน่ง toolbar จะอยู่กลับไปอยู่ในโหมด "inline" positioning
     หาก tap-toggling ถูกเปิดใช้งาน การสัมผัสหน้าจอจะเป็นการสลับการแสดงผลของ fix toolbar โดยการสัมผัสหน้าจอหนึ่งครั้งtoolbarจะถูกซ่อนไว้จนกว่าจะมีสัมผัสหน้าจออีกครั้ง ทำให้ผู้ใช้มีทางเลือก ที่จะซ่อนtoolbar จนกว่าจะต้องการให้แสดงอีกครั้ง ซึ่งในความเป็นจริงคือไม่ได้ทำการซ่อน แต่จะเป็นการสลับระหว่าง fixed position และ static position นั่นเอง
     หากต้องการตั้งค่า header หรือ footer สามารถทำได้โดยเพิ่ม attributeที่ชื่อว่า data-position="fixed"
• โหมด "fullscreen" position
     จะทำงานคล้ายๆกับfixed mode แต่ต่างกันที่ว่าถ้าไม่ได้ใช้โหมด fixed จะสามารถซ่อน toolbar ได้มากกว่า จึงเป็นประโยชน์สำหรับ apps ที่แสดงภาพหรือวิดีโอที่ต้องการให้แสดงผลเต็มหน้าจอ และแถบเครื่องมือสามารถซ่อนหรือเรียกให้ปรากฏโดยการแตะหน้าจอ ซึ่งแถบเครื่องมือในโหมดนี้ จะถูกนำมาใช้ได้ดีที่สุดสำหรับสถานการณ์ที่เฉพาะเจาะจง