使用 jQuery sider 防止元素转换答案

【问题标题】：Prevent element transition with jQuery sider使用 jQuery sider 防止元素转换
【发布时间】：2015-10-31 22:45:23
【问题描述】：

我有一个包含页面内容的主元素和一个右侧菜单栏（我使用了jquery sidr）。当我点击“右侧菜单”链接时，菜单会打开，但会将主 div 推到左侧。

这是我的代码：

<div style="position:relative">
    <div id="main_div style="position:absolute; z-index:20;"> 
        <a id="right-menu" href="#right-menu">Right Menu</a>
    </div>
    <div id="sidr" style="position:fixed">
      <ul>
        <li><a href="#">List 1</a></li>
        <li class="active"><a href="#">List 2</a></li>
        <li><a href="#">List 3</a></li>
      </ul>
    </div> 
</div>
<script>
$(document).ready(function() {
    $('#right-menu').sidr({
      name: 'sidr',
      side: 'right'
    });
});
</script>

sidr 元素的z-index 为10，小于主元素的z-index。我想在主要元素上打开 sidr，而不将主要元素推到左侧。我怎样才能做到这一点？谢谢...

【问题讨论】：

很可能，当菜单打开时，它会触发main 元素上的转换；我们需要查看更多代码 - 您是否碰巧有一个存在这种行为的实时网站？

标签： javascript jquery html css

【解决方案1】：

在 sidr 文档页面上，它说您可以选择关闭正文内容的位移：

jQuery(selector).sidr( [options] )

displace (Boolean) 默认值：true [1.2.0 及以上版本]

是否替换正文内容。

【讨论】：