2013-08-27 158 views
0

我在做正确的粘性导航功能的工作:(问题基金会zurb导航栏

我想要什么我的导航栏有/做的是在左边,一个“菜单”功能和标签“上,将允许某人拨打电话直接向我正确的电话图标”图标。

的资产净值做,我能理解另一件事是隐藏自己的页面上的第一张照片的背后。

如果任何人都可以帮助它将不胜感激。

<head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width"> 
    <title>ABC</title> 


    <link rel="stylesheet" href="css/foundation.css"> 
    <script src="js/vendor/custom.modernizr.js"></script> 
    <!-- Included JS Files --> 
    <script src="js/foundation/foundation.topbar.js"></script> 

    </head> 
    <body> 
    <!-- START Navigation --> 
    <div class="contain-to-grid sticky"> 
    <nav class="top-bar"> 
    <ul class="title-area"> 
    <!-- Title Area --> 
    <li class="name"></li> 
    <li class="toggle-topbar menu-icon"><a href="#"><span>MENU</span></a></li> 
    <li></li> 
    <li class="toggle-topbar call-icon"><a href="tel:1234567"><img src="img/75-phone.png" width="20" height="20"></a></li> 

<!-- Right Nav Section --> 
    <ul class="right"> 
    <li class="divider"></li> 
    <li><a href="#">About</a></li> 
    <li class="divider"></li> 
    <li class="has-dropdown"> <a href="#">Services</a> 
    <ul class="dropdown"> 
     <li class="divider"><a href="#">1</a></li> 
     <li class="divider"><a href="#">2</a></li> 
     <li class="divider"><a href="#">3</a></li> 
     <li class="divider"><a href="#">4</a></li> 
     <li class="divider"><a href="#">5</a></li> 
     <li class="divider"><a href="#">6</a></li> 
     <li class="divider"><a href="#">7</a></li> 
    </ul> 
    </li> 
    <li class="divider"></li> 
    <li><a href="#">Contact</a></li> 
    </ul> 
    </section> 
    </nav> 
    </div> 

    <!-- END Navigation --> 

    <!-- START Mobile logo --> 
    <div class="row"> 
    <div class=" small-12 large-12 columns"><img src="img/landing-page-tiles-logo.jpg"><center><h2></h2></center> 
    <hr /> 
    </div> 
    </div> 
    <!-- END Mobile Logo --> 

    <!-- END main content --> 

    <script> document.write('<script src=' + ('__proto__' in {} ? 'js/vendor/zepto' : 'js/vendor/jquery') + '.js><\/script>') </script> 

    <script src="js/foundation.min.js"></script> 


    <script>$(document).foundation(); </script> 
    </body> 
    </html> 

回答

0

如果连续显示这两段代码,你的右导航条位于<ul class="title-area">标签内。关闭此列表以允许您的<ul class="right">列表显示在其常规位置。