FrankMe: smoothes scrollen mit bootstrap funktioniert nicht

Beitrag lesen

SELF-Forum

smoothes scrollen mit bootstrap funktioniert nicht

FrankMe Homepage des Autors (Versionen)
– Informationen zu den Bewertungsregeln

problematische Seite

Hallo,

ich will entsprechend des Beispieles von w3schools.com eine Site sanft scrollen lassen, wenn man über das Menü einen neuen Punkt auswählt.

In der eingeladenen scrip.js steht die Funktion:


$(document).ready(function(){
	// Add scrollspy to <body>
	$('body').scrollspy({target: ".navbar", offset: 50});  
	// Add smooth scrolling on all links inside the navbar
	$("#myNavbar a").on('click', function(event) {
		// Make sure this.hash has a value before overriding default behavior
		if (this.hash !== "") {
			// Prevent default anchor click behavior
			event.preventDefault();
			// Store hash
			var hash = this.hash;
			// Using jQuery's animate() method to add smooth page scroll
			// The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area
			$('html, body').animate({
				scrollTop: $(hash).offset().top
			}, 800, function(){
				// Add hash (#) to URL when done scrolling (default click behavior)
				window.location.hash = hash;
			});
		}  // End if
	});
});

Im html header habe ich benötigte Dateien eingeladen (bootstrap.min.css, jquery.min.js, bootstrap.min.js). Im html body steht in der Navigation die entsprechende id:

<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>                        
            </button>
…
<div class="collapse navbar-collapse navbar-right" id="myNavbar" >...

Warum wird aber hart zu den jeweiligen Ankern geschaltet statt sanft gescrollt?

Beitrag melden
–
Informationen zu den Bewertungsregeln