jQuery Mobile开发组件

1、jQuery Mobile自定义属性

    1.data-role：定义不一样组件元素及页面视图等。如视图页面：data-role="page"。

    2.data-title：定义视图页面标题。

    3.data-transition：定义视图切换的动画效果。

        属性：

                slide：从右到左切换

                slideup：从下到上切换

                slidedown：从上到下切换

                pop：以弹出框的方式打开

                fade：渐变退色方式切换

                flip：就页面翻转飞出，新页面飞入

    4.data-rel：定义浮动层效果的视图。

    5.data-theme：定义元素或组件内容的主题样式风格。

    6.data-icon：在元素内添加一个icon小图标。

        属性：

                arrow-l：左箭头；arrow-r：右箭头；arrow-u：上箭头；arrow-d：下箭头；delete：删除；

                plus：加号；minus：减号；check：对号；gear：齿轮；refresh：刷新；forward：前进；

                back：返回；grid：网格；star：星星；alert：提示；info：信息；home：主页；search：查找；

    7.data-iconpos：定义icon小图标的位置，也能够指定只有按钮没有文字的按钮。

    8.data-inline：按钮根据内容自适应其长度。

    9.data-type：分组按钮按水平或垂直方向排列。

    10.data-add-back-btn：指定视图页面自动在页眉左侧添加返回按钮。

    11.data-back-btn-text：指定视图页面建立返回按钮的文本内容，一般都须要和 data-add-back-btn 一块儿使用。

    12.data-position：实如今滑动屏幕时工具栏的显示或隐藏状态。    

    13.data-fullscreen：指定全屏视图页面。

    14.data-navtive-menu：指定下拉选择功能采用平台内置的选择器。

    15.data-placeholder：设置下拉选择功能的占位符。

    16.data-inset：实现内嵌列表的功能。

    17.data-split-icon：设置列表右侧的图标。

    18.data-split-theme：设置列表右侧图标的主题样式风格。

    19.data-filter：开启列表过滤搜索功能。

2、网格布局

    css定义：定义前缀名称：ui-block 后面 + a/b/c/d ,最可能是五列。（同时须要指定外层div的样式是ui-gird 后面  + a/b/c/d）

    折叠块：data-role:collapsible;

    手风琴效果：最外层元素定义data-role="collapsible-set"，每个折叠区域定义data-role="collapsible"；