当启用面板向左滚动时，如何显示我的页面在左侧部分可见？

在这个链接中 ，我可以发现有一个覆盖选项，我可以隐藏或显示右侧或左侧的面板。 但我想在面板中显示90％或+的面板。 与facebook mobile相同的例子，我们可以选择同时看到朋友列表的新闻提要的一小部分。

我在上面提供的链接中尝试了一些代码为的代码

还有什么必须实现这一点，以使其进入状态，当面板可见时，我的页面的90％必须隐藏在页面的一侧。

谢谢

Answer 1

您需要覆盖许多类才能实现90％的页面面板。

1. 面板总宽度：

    .ui-panel { width: 90%; } 

2. 小组的位置（左）：

   等于Panel的宽度。

    .ui-panel-position-left { left: -90% !important; } 

3. 打开面板（3D变换）：

    .ui-panel-open { -webkit-transform: translate3d(97%, 0, 0) !important; transform: translate3d(97%, 0, 0) !important; } 

4. 动画：

   增加或减少速度（ms）。

    .ui-panel-animate { -webkit-transition: -webkit-transform 500ms ease; -moz-transition: -moz-transform 500ms ease; transition: transform 500ms ease; } 

5. 面板的叠加/包装：

   这包括data-dismissible设置为true或false的面板的可单击区域

    .ui-panel-content-wrap-position-left.ui-panel-content-wrap-open, .ui-panel-dismiss-position-left.ui-panel-dismiss-open { left: 90% !important; right: -90% !important; } 

演示