如何在画布菜单中使用锚点？

Question

我有这段代码：

<div class="off-canvas-wrap">
  <div class="inner-wrap">
    <aside class="left-off-canvas-menu">

      <ul class="off-canvas-list">
        <li><label class="first">Foundation</label></li>
        <li><a href="http://foundation.zurb.com/index.html">Home</a></li>
      </ul>

      <hr>

      <ul class="off-canvas-list">
        <li><label class="first">Learn</label></li>
        <li><a href="#main">Anchor1</a></li>
      </ul>

      <hr>

我想点击Anchor1链接，并在网页滚动到右边锚点后关闭画布菜单。

我该怎么做？

-

我发现关闭画布菜单：

<script>
   $(document).ready(function() {
   $('a[href="#anchor1"]').click(function() { 
   $(".menu-wrap").removeClass("move-right");       
   });
   });
</script>

Answer 1

当我遇到同样的问题时，我刚看到这个问题。

实际基金会为此提供了一个选项，您可以将其设置为true： http://foundation.zurb.com/docs/components/offcanvas.html#optional-javascript-configuration

$(document).foundation({
  offcanvas : {
    // Sets method in which offcanvas opens.
    // [ move | overlap_single | overlap ]
    open_method: 'move', 
    // Should the menu close when a menu link is clicked?
    // [ true | false ]
    close_on_click : false
  }
});