2016-04-03 11 views
1

Ich versuche den Abschnitt "Fotografie" in meiner Navigationsleiste mit der Seite fotos.html zu verknüpfen. Aus irgendeinem Grund funktioniert der Link nicht, aber wenn ich die Seite in die URL eingebe, erscheint die richtige Seite. Ich habe versucht, den Link außerhalb der Navbar-Liste und es funktioniert noch aus irgendeinem Grund funktioniert nicht, wenn ich es mit einer der Auswahlen in der Navigationsleiste verknüpfen.Navbar Link zu anderen Seiten funktioniert nicht

<nav class="navbar navbar-default navbar-fixed-top navbar-centered navbar-custom"> 
    <div class="container-fluid"> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar"> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
      </button> 
      <a class="navbar-brand" href=#title><img src="rectangle_logo(1).png" height="25px"></a> 
     </div> 
     <div class="collapse navbar-collapse" id="myNavbar"> 
      <ul class="nav navbar-nav navbar-center"> 
       <li> <a href=#title>Home </a></li> 
       <li> <a href=#about> About</a></li> 
       <li> <a href=#Projects> Projects </a></li> 
       <li> <a href="photos.html">Photography </a><li> //here is where I try and link to the next page 
       <li><a href=#Contact> Contact </a></li> 
      </ul> 
     </div> 
    </div> 
</nav> 

Home Page und Page that need to Redirect user to

Antwort

3

Ihre JavaScript-Funktion verhindert, dass der Link richtig funktioniert:

$(".navbar a,.title a, footer a[href='#myPage']").on('click', function(event) { 

     // Prevent default anchor click behavior 
     event.preventDefault(); 

} 

Sie können Benutzerklassen auf die Links, dass Ihre Funktion arbeiten soll:

<ul class="nav navbar-nav navbar-center"> 
    <li> <a href="#title" class="prevent">Home </a></li> 
    <li> <a href="#about" class="prevent"> About</a></li> 
    <li> <a href="#Projects" class="prevent"> Projects </a></li> 
    <li> <a href="photos.html">Photography </a></li> //here is where I try and link to the next page 
    <li> <a href="#Contact" class="prevent"> Contact </a></li> 
</ul> 

und dann JavaScript in die neue Klasse ändern:

$(".navbar .prevent,.title a, footer a[href='#myPage']").on('click', function(event) { 

     // Prevent default anchor click behavior 
     event.preventDefault(); 

} 
1

Es ist ein Tippfehler

<li> <a href="photos.html">Photography </a><li> 

haben geschlossen <li> Tag werden als </li>

<li> <a href="photos.html">Photography </a></li> 
0

Es gibt ein Fehler im Code

$('html, body').animate({ 
     scrollTop: $(hash).offset().top 
     }, 900, function(){ 


Can not read property top of undefined 
Verwandte Themen