javascript - Jasny Bootstrap - offcanvas 避免推送主页：如何强制菜单重叠？

Question

我在 Prestashop 上使用Jasny Bootstrap的offcanvas.js 。

我的画布菜单，一旦单击按钮，就会推动左侧的主页并从左侧进入幻灯片。

我想实现这一点：

单击按钮后，主页SHOULD NOT MOVE，offcanvas 应该从左侧滑动（就像现在一样）但是，而不是推动它，重叠主页...

我应该更改 offcanvas.js 的哪个部分？

Answer 1

听起来您使用的是“推送”而不是“滑动”选项。使用“offcanvas”类，它应该可以工作。查看这些示例： http ://www.jasny.net/bootstrap/examples/navmenu/

我想要所有视图的滑入，所以我只是使用了“offcanvas”类，而不是您在滑入示例的源代码中看到的“offcanvas-sm”：

    <div class="navmenu navmenu-default navmenu-fixed-left offcanvas-sm">
  <a class="navmenu-brand visible-md visible-lg" href="#">Project name</a>
  <ul class="nav navmenu-nav">
    <li class="active"><a href="./">Slide in</a></li>
    <li><a href="../navmenu-push/">Push</a></li>
    <li><a href="../navmenu-reveal/">Reveal</a></li>
    <li><a href="../navbar-offcanvas/">Off canvas navbar</a></li>
  </ul>
  <ul class="nav navmenu-nav">
    <li><a href="#">Link</a></li>
    <li><a href="#">Link</a></li>
    <li><a href="#">Link</a></li>
    <li class="dropdown">
      <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
      <ul class="dropdown-menu navmenu-nav">
        <li><a href="#">Action</a></li>
        <li><a href="#">Another action</a></li>
        <li><a href="#">Something else here</a></li>
        <li class="divider"></li>
        <li class="dropdown-header">Nav header</li>
        <li><a href="#">Separated link</a></li>
        <li><a href="#">One more separated link</a></li>
      </ul>
    </li>
  </ul>
</div>

<div class="navbar navbar-default navbar-fixed-top hidden-md hidden-lg">
  <button type="button" class="navbar-toggle" data-toggle="offcanvas" data-target=".navmenu">
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
  </button>
  <a class="navbar-brand" href="#">Project name</a>
</div>

Answer 2

我评论了第 155 行：

//$('body').css(prop, padding)

第 187 行：

//$(this).css(placement, 0)

并全部替换canvas-sliding为班级no-sliding...

它通过尝试工作！