JQuery moblile Demos Learning record panel

Source: Internet
Author: User

JQuery moblile Demos Learning record panel
    • 11. Two
    • /
    • Jquery Mobile
    • /
    • No Comments

This article originates from www.ifyao.com Forbidden reprint! www.ifyao.com

I would like to summarize briefly:

Panel Location: Data-position Property Control: Value: Left,right,

Display Mode: Data-display property value: Reveal default on the page, overlay page, push and page unification, push the page.

The panel should be placed before or after header,content,footer, but cannot be outside the page.

Like this.

Source Code
<div data-role="page" > <div data-role=id=<!--panel Content goes here--</div><!--/panel-- <!--header -- <!--Content-<!--footer </div><!--page -- 

The event should be triggered when you want to dynamically add content or if it is hidden:

$( "#mypanel" ).trigger( "updatelayout" );The framework checks the panel's height, and when the content height exceeds the height of the screen, it will be set to Min-height, and the panel will scroll. Data-swipe-close= "False" can be set after the panel is opened cannot be closed by clicking the page paneldata-dismissible= "false" panel inside Add a button, plus data-rel= "close" You can turn off paneldata-animate= "false" to turn off panel animation data-position-fixed= "True" to prevent panel scrolling and inaccessible. Overflow it is possible to display only panel that is not absolutely positioned. When the menu content in a panel is too long to exceed the screen width, the fixed state is canceled, allowing the panel to scroll. Frame, panel with Div, class= "ui-panel-inner" default 15 pixels Paddingpanel has a fixed width of 17em can be added data-theme on the panel frame or set data-theme= " None "and set your own style. Pay attention to adding padding. The above content is taken from the official demo, I translate, without permission to prohibit reprint!

This article originates from www.ifyao.com Forbidden reprint! www.ifyao.com

JQuery moblile Demos Learning record panel

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.