Question

我正在尝试制作一个存在于两个级别的幻灯片菜单。单击第一个幻灯片菜单中的项目时，将打开第二个幻灯片菜单。第二个幻灯片放在较大屏幕上的幻灯片旁边，在较小的屏幕上，它覆盖了所有内容。

 http://jquerymobile.com/demos/1.3.0-beta.1/docs/panels/index.html

在文档中，它说：

使用标记控制面板时，一次只能打开一个面板。当一个面板已经打开时，单击一个链接打开面板将自动关闭第一个面板。这样做是为了使仅标记配置保持简单。

也就是说，可以通过编程方式一次打开多个面板：

 $( "#idofpanel" )
    .panel( "open" , optionsHash )
      .then( function( options ) {
        $( "#idofpanel2" ).panel( "open" , options );
     });

但是他们没有说出选项应该是什么。

我目前的HTML是：

<div data-role="panel" id="gridItemDetailPanel" data-position="left" data-swipe-close="false" data-dismissible="false" data-display="overlay">
        <a  data-role="button" id="testOpen2" >test</a>
</div>
<div data-role="panel" id="gridItemDetailPanel2" data-position="left" data-display="overlay">
TEST2
</div>

Onclick＃testOpen2

$("#testOpen2").click(function(){
   $( "#gridItemDetailPanel2" ).panel( "open");
});

当我点击＃testOpen2时，第一个幻灯片将消失，第二个幻灯片将出现。我怎么能这样做？

JQuery Mobile - 在大屏幕上并排显示面板

0 个答案: