2013-02-03 23 views
1

我正在我自己的個人網站上工作here。如果您將鼠標懸停在任何導航欄元素上,您都會看到閃爍,並且並非所有元素都可見。您可以通過F12進行驗證。在我看來,<aside>標籤「隱藏」了我正在尋找的信息。HTML旁邊是隱藏我的js導航欄

會有人請告訴我如何將導航欄放到某個東西的前面。我不確定這裏發生了什麼事。

index.php

<!DOCTYPE HTML> 
<html lang="en"> 
    <head> 
     <meta charset="UTF-8"/> 
     <title>Grown Kidd Creations</title> 
     <link rel="stylesheet" href="css/main.css"> 
     <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script> 
     <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script> 
     <script type="text/javascript"> 
      $(document).ready(function(){ 
      }); 
     </script> 
    </head> 
    <body> 
     <header> 
      <img alt="Picture of me and Cian" src="img/caindaddysleepin.jpeg" title="Cian and Daddy"> 
      <?include_once 'nav/nav.php';?> 
     </header> 
     <aside class="left"><p>No idea what to put here. how about you fill out the form and tell me?</p></aside> 

     <aside class="right"> 
      Recent News/Updates:<br/> 
      <span class="undercon">This will be updated soon with links and maybe a blog.</span> 
      <ul> 
       <li>Cian</li> 
       <li>Work</li> 
       <li>Family</li> 
      </ul> 
     </aside> 
     <footer> 
      Send me some love at <a href="mailto:[email protected]">[email protected]</a><br/> 
      Or find me at:<br/> 
      <div class="g-plus" data-href="https://plus.google.com/109325835178774768962?prsrc=3" data-theme="dark" rel="author"></div> 
      <a href="https://twitter.com/ThaKidd04" class="twitter-follow-button" data-show-count="false" data-size="large">Follow @ThaKidd04</a> 
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script> 
     </footer> 
    </body> 
</html> 

nav.php

<?//navigation bar?> 
<script> 
    var el = document.getElementsByTagName("body")[0]; 
    el.className = ""; 
</script> 
<noscript> 
<!--[if IE]> 
    <link rel="stylesheet" href="nav/css/ie.css"> 
<![endif]--> 
</noscript> 
<link rel="stylesheet" href="nav/css/nav.css"> 
    <!--[if IE]> 
     <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> 
    <![endif]--> 
    <nav id="topNav" class="no-js"> 
     <ul> 
      <li><a href="index.php" title="Home">Home</a></li> 
      <li><a href="#" title="Projects">Projects</a> 
       <ul> 
        <li><a href="" title="Personal Projects">Personal Projects</a></li> 
        <li><a href="" title="Work Projects">Work Projects</a></li> 
        <li class="last"><a href="pages/sitepage.php" target="new" title="About this site">This Site</a></li> 
       </ul> 
      </li> 
      <li><a href="contactme.php" title="Contact Me">Contact Me</a> 
       <ul> 
        <li><a href="http://www.facebook.com/BillyThaKidd" target="new" title="FaceBook">FaceBook</a></li> 
        <li><a href="" target="new" title="Google Plus">Google +</a></li> 
        <li><a href="" target="new" title="LinkedIn">LinkedIn</a></li> 
        <li class="last"><a href="" title="Email Me">Email Me</a></li> 
       </ul> 
      </li> 
      <li><a href="/pages/viewblog.php" title="About Me">About Me</a> 
       <ul> 
        <li><a href="/pages/viewblog.php">Blog</a></li> 
        <li><a href="" title="Resume">Resume</a></li> 
        <li class="last"><a target="new" href="https://github.com/billythakidd04" title="GitHub">GitHub</a></li> 
       </ul> 
      </li> 
     </ul> 
    </nav> 
    <script src="nav/js/modernizr.custom.69568.js"></script> 
    <script> 
     (function($) 
     { 
      //cache nav 
      var nav = $("#topNav"); 

      //add indicators and hovers to submenu parents 
      nav.find("li").each(function() 
      { 
       if ($(this).find("ul").length > 0) 
       { 
        $("<span>").text("").appendTo($(this).children(":first")); 

        //show subnav on hover 
        $(this).mouseenter(function() 
        { 
         $(this).find("ul").stop(true, true).slideDown(); 
        }); 

        //hide submenus on exit 
        $(this).mouseleave(function() 
        { 
         $(this).find("ul").stop(true, true).slideUp(); 
        }); 
       } 
      }); 
     })(jQuery); 
    </script> 

回答

1

你應該張貼您的css因爲它似乎是整個問題連接,或者至少是可以解決的,由z-index調整:

z-index CSS屬性指定元素及其後代的z順序。當元素重疊時,z順序決定哪一個 覆蓋另一個。具有較大z-索引的元素通常覆蓋較低元素的 元素。

+1

^^這傢伙FTW!我加入的完美答案/解決方案'nav { \t z-index:1; } :not nav { \t z-index:0;並且它完美地工作。 –