無法單擊導航欄中的鏈接CSS HTML

不確定是否允許您鏈接您的網站，但是如果允許。因此，我可以將所有鏈接懸停在導航欄中，但我無法點擊它們，並且S的圖片是可移動的，但無法點擊，我做錯了什麼？無法單擊導航欄中的鏈接CSS HTML

<!doctype html> 
<html> 
<head lang="en"> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> 

    <title>Nickeb0i Scripts - Landing Page</title> 
    <meta property="og:title" content=""> 

    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"> 
    <link rel="stylesheet" href="fancybox/jquery.fancybox-v=2.1.5.css" type="text/css" media="screen"> 
    <link rel="stylesheet" href="css/font-awesome.min.css" rel="stylesheet"> 

    <link rel="stylesheet" type="text/css" href="css/style.css">  

    <link href='http://fonts.googleapis.com/css?family=Titillium+Web:400,600,300,200&subset=latin,latin-ext' rel='stylesheet' type='text/css'> 
    <link rel="prefetch" href="images/zoom.png"> 
</head> 
<body> 
    <div class="navbar navbar-fixed-top" data-activeslide="1"> 
     <div class="container"> 
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse"> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
      </button> 
      <div class="nav-collapse collapse navbar-responsive-collapse"> 
       <ul class="nav row"> 
        <li data-slide="1" class="col-12 col-sm-2"><a id="menu-link-1"> <span class="icon icon-home"></span> <span class="text">HOME</span></a></li> 
        <li data-slide="2" class="col-12 col-sm-2"><a id="menu-link-2" href="/services"> <span class="icon icon-user"></span> <span class="text">SERVICES</span></a></li> 
        <li data-slide="3" class="col-12 col-sm-2"><a id="menu-link-3" href="/scripts"> <span class="icon icon-briefcase"></span> <span class="text">SCRIPTS</span></a></li></ul> 
       <div class="row"> 
        <div class="col-sm-2 active-menu"></div> 
       </div> 
      </div><!-- /.nav-collapse --> 
     </div><!-- /.container --> 
    </div><!-- /.navbar --> 
    <div class="slide story" id="slide-1" data-slide="1"> 
     <div class="container"> 
      <div id="home-row-1" class="row clearfix"> 
       <div class="col-12"> 
        <h1 class="font-semibold">NICKEB0I <span class="font-thin">SCRIPTS</span></h1> 
        <br> 
        <br> 
       </div><!-- /col-12 --> 
      </div><!-- /row --> 
      <div id="home-row-2" class="row clearfix"> 
       <div class="col-12 col-sm-4"><div class="home-hover navigation-slide" data-slide="4"><a href="/scripts"><img src="images/s03.png"></a></div><span>SCRIPTS</span></div> 
       <div class="col-12 col-sm-4"><div class="" data-slide="3"></div></div> 
       <div class="col-12 col-sm-4"><div class="home-hover navigation-slide" data-slide="5"><a href="/services"><img src="images/s03.png"></a></div><span>SERVICES</span></div> 
      </div><!-- /row --> 
     </div><!-- /container --> 
    </div><!-- /slide1 --> 
    <footer> 
     <div class="container"> 
      <p><font color="white">Copyright &copy; Nickeb0i 2016</font><p> 
     </div> 
    </footer> 

</body> 
    <script src="js/html5shiv.js"></script> 
    <script src="js/jquery-1.10.2.min.js"></script> 
    <script src="js/jquery-migrate-1.2.1.min.js"></script> 
    <script src="js/bootstrap.min.js"></script> 
    <script src="js/jquery.easing.1.3.js"></script> 
    <script type="text/javascript" src="fancybox/jquery.fancybox.pack-v=2.1.5.js"></script> 
    <script src="js/script.js"></script> 

    <script> 
    $(document).ready(function(e) { 
     var lis = $('.nav > li'); 
     menu_focus(lis[0], 1); 

     $(".fancybox").fancybox({ 
      padding: 10, 
      helpers: { 
       overlay: { 
        locked: false 
       } 
      } 
     }); 

    }); 
    </script> 

</html>

來源

2016-03-03 Niklas Erizkn

你需要在這個網站上顯示你的代碼。問題的外部鏈接將變得過時，並在將來使這個問題變得毫無用處。 – Quantastical

我並不完全確定錯誤的來源，但我會給你一些代碼 –

看看[如何創建最小，完整和可驗證的示例]（http://stackoverflow.com/幫助/ MCVE）。 – Quantastical

你已經寫href = "/services"，加斜槓和寫href = "/services/"。這應該工作。

來源

2016-03-03 22:11:38 Gendarme

它不起作用= /仍然是同樣的事情，不能點擊它，但我可以將它懸停 –

@NiklasErizkn我編輯了我的答案。你確定你寫了我編輯的內容，而不是第一個答案嗎？ – Gendarme

啊啊，謝謝=） –

我不能完全肯定，這是關係到它，但如果我點擊一個按鈕，我的控制檯立即顯示一個錯誤：

script.js:187 Uncaught TypeError: Cannot read property 'top' of undefined

來源

2016-03-03 22:13:52 iSidle

它現在的工作:) –

你收到此錯誤 Uncaught TypeError: Cannot read property 'top' of undefined

因爲你「再試圖選擇一個DOM對象不存在：

var offset_top = (dataslide == 1) ? '0px' : $('.slide[data-slide="' + dataslide + '"]').offset().top;

添加帶有數據幻燈片屬性的元素slide將停止該錯誤。

但是你應該問問自己，你真的需要JavaScript這樣的導航和懸停效果？

來源

2016-03-03 22:22:50

我使用引導，所以我想有沒有不必要的東西在它:) –

無法單擊導航欄中的鏈接CSS HTML

回答

相關問題