Question

我正在使用粉底+整页js。

汉堡包菜单在那里，但是当我点击它时，没有任何反应。

<div class="hide-for-large-only ">
    <div class="off-canvas-wrap" data-offcanvas>
        <div class="inner-wrap">
            <nav class="tab-bar">
              <section class="left-small">
                <a class="left-off-canvas-toggle menu-icon" href="#"><span></span></a>
              </section>

              <section class="middle tab-bar-section">
                <h1 class="title">company name</h1>
              </section>

            </nav>

            <aside class="left-off-canvas-menu">
              <ul class="off-canvas-list">
                <li><label>Menus</label></li>
                <li><a href="#">Home</a></li>
                <li><a href="#">about</a></li>
                <li><a href="#">products</a></li>
                <li><a href="#">Contact Us</a></li>
              </ul>
            </aside>

            <section class="main-section">
              <!-- content goes here -->
            </section>

            <a class="exit-off-canvas"></a>

        </div>
    </div>
</div>

我还有另一个导航栏，它只能在大屏幕上显示，并且可以在中等和下方隐藏。

<header>
        <nav id="menu" class="hide-for-medium-down">
            <a data-menuanchor="home" href="#home"><img class="logo" alt="" src="img/logo1.png"></a>
                <ul class="menutext">
                    <li data-menuanchor="home"><a href="#home">Home</a></li>
                    <li data-menuanchor="about"><a href="#about">about</a></li>
                    <li data-menuanchor="products"><a href="#prodcuts">products</a></li>
                    <li data-menuanchor="contactus"><a href="#contactus">Contact</a></li>
                </ul>
        </nav>
    </header>

我该如何解决这个问题？

Answer 1

我之前遇到过同样的问题。我不知道为什么会发生这种情况。但我发现我的修复是在页面底部初始化基础。类似的东西：

<script>
$(document).ready(function(){
   $(document).foundation();
});
</script>

不确定这是否正确，但它对我有用。不要认为有足够的信息来完全回答这个问题，而不仅仅是捅了它。

基础非画布菜单+ Fullpage js冲突

1 个答案: