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

3.2 Toolbars

     c. Footers
Footer bar structure
โครงสร้างของ Footer bar
   Footer bar มีโครงสร้างพื้นฐานคล้ายๆกับ header โดยเริ่มต้น footer จะถูกกำหนดให้มีธีมเป็นสีดำ แต่ต่างกันที่ footer จะใช้ attribute ที่ชื่อว่า data-role=footer
CD ไฟล์: Footer bar structure.html

เนื้อหาของ Footer(Footer content)
   ธีม และองค์ประกอบของFooter คล้ายกับ header มากๆ แต่ส่วนที่แตกต่างหลักๆคือ footer ถูกออกแบบมาให้มีโครงสร้างน้อยกว่า header เพื่อให้มีความยืดหยุ่นมากขึ้น ดังนั้น framework จะไม่กำหนดว่าปุ่มจะต้องอยู่ทางซ้ายหรือทางขวาเหมือนกับ header
การเพิ่มปุ่ม(Adding buttons)    ลิงค์หรือมาร์กอัปของปุ่ม ที่จะเพิ่มลงใน footer จะกลายเป็นปุ่มโดยอัตโนมัติเพื่อประหยัดพื้นที่ โดยปุ่มใน toolbar จะถูกกำหนดให้เป็น inline styling โดยปุ่มจะมีเพียงข้อความและไอคอนเท่านั้น
   โดยค่าเริ่มต้น toolbar จะไม่มี nav bars และ widget อื่นๆ ซึ่งจะต้องเรียกใช้ padding และเพิ่ม class="ui-bar" ลงใน Footer CD ไฟล์: Adding buttons to the footer.html

   หากต้องการ group buttons ให้เป็นกลุ่มเดียวกัน จะต้องครอบลิงค์ด้วย data-role="controlgroup" และ data-type="horizontal"
CD ไฟล์:Group buttons in the footer.html

การเพิ่มฟอร์ม(Adding form elements)
   ฟอร์มและเนื้อหาอื่นๆสามารถเพิ่งในtoolbar ได้ ซึ่งตัวอย่างเป็นการเพิ่มเมนูภายใน footer bar โดยแนะนำให้ใช้ elements ของ formเป็น mini-sized ด้วยการเพิ่ม attribute ที่ชื่อว่า data-mini="true" CD ไฟล์: Add form to the footer.html

Fixed & Persistent footers
   Footer เป็นส่วนที่เป็น element นำทางทั่วไป หากต้องการfixให้แสดงอยู่กับที่จะต้องไม่ แสดงscroll และสามารถ fixได้แบบถาวรไม่ย้ายไปมาในระหว่างการเปลี่ยนเพจ สามารถทำได้ โดยการเรียกใช้ feature ที่ชื่อว่า persistent ด้วยการเพิ่ม attributeที่ชื่อว่า data-id ลงใน footer
เช่น เพิ่ม data-id="myfooter" ลงใน current page และ target page โดยframeworkจะช่วยให้ได้
   มุมมองที่เหมือนกันในระหว่างการเปลี่ยนแปลง ซึ่งeffect จะทำงานได้อย่างถูกต้อง หากส่วนheader และfooter ถูกกำหนดด้วย data-position="fixed" เหมือนกันทั้งคู่