1

我有一个带有 zurb 的固定顶栏菜单,包含在网格中。菜单上方(滚动前)是一个附加菜单,它被滚动到屏幕外,然后固定 zurb 顶栏。这是对的。

但是,当您然后单击菜单图标时,页面滚动然后会转到页面顶部,这意味着第一个菜单会重新出现。在您再次折叠菜单并显示布局被搞砸之前,这并不是什么大问题。

我尝试在 scolltop 中禁用滚动:JS 文件中的 false ,并使用数据选项在 html 中内联,但它似乎没有做任何事情!

任何指导将不胜感激!

代码:

<div class="row">
<div class="contain-to-grid sticky">

<nav class="top-bar">
  <ul class="title-area">

<!-- Title Area -->

   <li class="name">
    <h1><a href="#"><img src="img/parts/clouds.png" alt="Scan and Share Photo Scanning"></a>    </h1>

    <div id="secondary-logo"><img src="img/parts/scan-share.png" width="267" height="79" alt="Scan old Photos"> </div>
  </li>

<!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->

  <li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li>

</ul>

<section class="top-bar-section">

<!-- Left Nav Section -->

<ul class="left"> <li class="active"><a href="#">HOME</a></li>
  <li ><a href="#">HOW IT WORKS</a></li>
  <li ><a href="#">WHY USE US</a></li>
  <li><a href="#">SERVICES</a></li>
  <li ><a href="#">FAQ</a></li>
  <li ><a href="#">BLOG</a></li>
  <li ><a href="#">CONTACT</a></li>
</ul>

<!-- Right Nav Section -->

</section>
</nav>
</div>
</div>

开发站点的链接是http://scanshare.webdevspace.co.uk

文档在这里: http: //foundation.zurb.com/docs/components/top-bar.html

4

0 回答 0