面板选项 Panel Options

animate 动画。类型:布尔值。默认值:true。

设置是否在关闭和开启面板将动画。如果设置为false,面板打开时,动画会消失。这是推荐的最快的性能。也可以在HTML中添加 data-animate="false" 属性来取消动画。

//初始化 
$( ".selector" ).panel({ animate: false });
 
// getter 
var animate = $( ".selector" ).panel( "option", "animate" );
 
// setter 
$( ".selector" ).panel( "option", "animate", false );

dismissible 类型:布尔值。默认值:true。

点击网页外边可以关闭面板。

//初始化 
$( ".selector" ).panel({ dismissible: false });
 
// getter 
var dismissible = $( ".selector" ).panel( "option", "dismissible" );
 
// setter 
$( ".selector" ).panel( "option", "dismissible", false );

display 类型:字符串。默认值:"reveal"。

面板显示位置与网页的层次关系。像幻灯片划出,在侧栏显示("reveal")。以面板内容为宽度,作为一个列来显示("push")。面板叠加在页面内容上层 ("overlay")。也可以在HTML上添加data-display="push"属性来设置。

//初始化 
$( ".selector" ).panel({ display: "overlay" });
 
// getter 
var display = $( ".selector" ).panel( "option", "display" );
 
// setter 
$( ".selector" ).panel( "option", "display", "overlay" );

initSelector 类型:CSS选择器字符串。默认值:":jqmData(role='panel')"。

这是用来定义选择器(元素类型,数据的角色,等等),将被自动初始化为面板。

$( document ).on( "mobileinit", function() { 
  $.mobile.panel.prototype.options.initSelector = ".mypanel"; 
});

position 类型:字符串。默认值:"left"。

面板显示位置。选择值: "left" 、 "right"。也可以在HTML中添加 data-position="right" 属性来设置在右侧出现。

//初始化 
$( ".selector" ).panel({ position: "right" });
 
// getter 
var position = $( ".selector" ).panel( "option", "position" );
 
// setter 
$( ".selector" ).panel( "option", "position", "right" );

positionFixed 类型:布尔值。默认值:false。

设置面板固定定位,即使页面内容向下滚动。这也使得页面滚动而面板保持固定。我们建议不启用此功能时,面板用于在Android应用程序因效果不佳和显示问题。也可以在HTML中添加 data-position-fixed=true 属性来开启。

//初始化 
$( ".selector" ).panel({ positionFixed: true });
 
// getter 
var positionFixed = $( ".selector" ).panel( "option", "positionFixed" );
 
// setter 
$( ".selector" ).panel( "option", "positionFixed", true );

swipeClose 类型:布尔值。默认值:true。

设置面板关闭,可以通过向左或向右滑动面板来关闭。也可以在HTML中添加 data-swipe-close=false 属性来关闭此功能。

//初始化 
$( ".selector" ).panel({ swipeClose: false });
 
// getter 
var swipeClose = $( ".selector" ).panel( "option", "swipeClose" );
 
// setter 
$( ".selector" ).panel( "option", "swipeClose", false );

theme 类型:字符串。默认值:"c"。

设置面板的配色方案(样式)。它接受从A到Z字母。也可以在HTML中添加 data-theme="a" 属性来设置为黑色。

//初始化 
$( ".selector" ).panel({ theme: "a" });
 
// getter 
var theme = $( ".selector" ).panel( "option", "theme" );
 
// setter 
$( ".selector" ).panel( "option", "theme", "a" );

classes.animate 类型:字符串。默认值:"ui-panel-animate"。

当面板的动画选项是true并且3D过渡转场的返回值也是true的时候,给面板、页面容器和固定栏添加的CSS类。

classes.contentFixedToolbar 类型:字符串。默认值:"ui-panel-fixed-toolbar-wrap"。

向页面容器添加的抑制水平滚动的CSS类。

classes.contentFixedToolbarClosed 类型:字符串。默认值:"ui-panel-content-fixed-toolbar-closed"。

动画完成后,给固定栏添加的CSS类。

classes.contentFixedToolbarOpen 类型:字符串。默认值:"ui-panel-content-fixed-toolbar-open"。

面板打开状态时,给固定栏添加的CSS类。

classes.contentWrap 类型:字符串。默认值:"ui-panel-content-wrap"。

注入的包围页面内容(header, content, footer)的容器,被添加的CSS类,用于定位面板的位置。

classes.contentWrapClosed 类型:字符串。默认值:"ui-panel-content-wrap-closed"。

动画完成后,给页面容器添加的CSS类。

classes.contentWrapOpen 类型:字符串。默认值:"ui-panel-content-wrap-open"。

注入的包围页面内容(header, content, footer)的容器,被添加的CSS类,只在转场时,用于定位硬件加速。

classes.pagePanel 类型:字符串。默认值:"ui-page-panel"。

当面板工具响应时,给页面添加的CSS类。

classes.pagePanelOpen 类型:字符串。默认值:"ui-page-panel-open"。

当面板打开状态时,给页面添加的CSS类。

classes.panel 类型:字符串。默认值:"ui-panel"。

给面板添加的CSS类。

classes.panelClosed 类型:字符串。默认值:"ui-panel-closed"。

当面板是关闭时,给面板添加的CSS类。

classes.panelOpen 类型:字符串。默认值:"ui-panel-open"。

当面板容器打开时,添加的CSS类,只在转场时,用于定位硬件加速。

classes.panelFixed 类型:字符串。默认值:"ui-panel-fixed"。

当面板是固定定位时,给面板添加的CSS类。

classes.panelInner 类型:字符串。默认值:"ui-panel-inner"。

给面板内容容器div,添加的CSS类。