jQuery

อภิเชษฐ์ แกว้ มณี การพฒั นาเวบ็ แอพบน jQuerySmartphoneดว้ ย Mobileเรียนรู้การใช้ jQuery Mobile : Panelสร้างเว็บแอพพลเิ คชน่ั สาหรับ Smart phone

วตั ถุประสงค์ จ จดั ทาขนึ ้ เพ่ือ ให้ทราบถึงการเข้าใช้ jQuery Mobile : Panelและลกู เลน่ ตา่ งๆ เพอ่ื นนามาประยกุ ต์ใช้ในงานตอ่ ไป

สารบญั หน้า เร่ือง 1 2jQuery Mobile: Panels 3jQuery Mobile: Positioning 4-5PanelsjQuery Mobile: PanelDisplayjQuery Mobile: ClosingPanels

jQuery Mobile: PanelsPanel คอื แผ่นข้อมลู หรือแผงข้อมลูวธิ ีเปิดเข้า Panels กดที่ป่ มุ Open Panel

jQuery Mobile: Panel DisplayEffect การแสดง แผงข้อมลู (Panels) มี 3 ลกั ษณะ คือ

jQuery Mobile: Positioning Panelsโดยทว่ั ไป (Default) นนั้ การแสดงผลแผง Panel จะแสดงในด้านซ้าย แตส่ ามารถกาหนดให้แสดงใน ด้านขวาได้ โดยใช้ Attribute ชื่อวา่ data-position=\"right\"

jQuery Mobile: Closing Panels การปิด Panel หรือ การผิดแผงข้อมลู นนั ้ สามารถทาได้ 4 วิธี 1) การปิดแบบปกติ คือ การแตะสว่ นท่ีไมใ่ ช่ Panel จากนนั ้ แผง Panel จะถกู ปิดลง2) การปิดแบบต้องลาก (left swipe) ไปทางซ้าย (data-dismissible = “True | False”)

jQuery Mobile: Closing Panels3) การปิดแบบใดๆ ท่ีไมใ่ ชก่ ารลาก (swipe close) (data-swipe-close = “True | False”)4) การปิดแบบสร้างป่ มุ ในแผง Panel เพ่ือแตะและปิด Panel

แบบทดสอบ1.วิธีการเปิ ด Panel2.คาสง่ั ในการแสดงแผง Panel หลกั เลือ่ นไปทางขวา3.วิธีการปิ ด Panel

อ้างองิ1.http://www.teacher.ssru.ac.th/nutthapat_ke/file.php/1/JQUERYMOBILE_NUTTHAPAT.pdf2.http://nextflow.in.th/%E0%B9%80%E0%B8%A3%E0%B8%B5%E0%B8%A2%E0%B8%99-jquery-mobile/3.https://www.youtube.com/watch?v=-xUnURhsxiI4.https://www.youtube.com/watch?v=8IYzyTYucKQ

jQuery Mobile : Panel