0
У меня есть простая компоновка с bootstrap и smooth.js (jQuery). Без js, когда я нажимаю ссылки, они переходят в нужный сектор, но когда я добавляю smooth.js, они даже не двигаются и не реагируют. Код ниже, пожалуйста, помогите, потому что я попробовал несколько javascript для smoothscroll, и каждый раз, когда есть такая же ошибка, но я не вижу этого.SmoothScroll не работает и блокирует ссылки меню
$(function(){
$('a[href^="#"]').click(function(e){
var target = $(this).attr('href');
var strip = target.slice(1);
var anchor = $("[name='"+ strip +"']");
e.preventDefault(); //usuwa przeladowania strony
$('html,body'). animate({
scrollTop: anchor.offset().top
},'slow');
});
});<!DOCTYPE HTML>
<html>
<head>
<link rel="stylesheet" href="style.css" type="text/css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<link rel="stylesheet" href="./css/bootstrap-glyphicons.css" type="text/css">
<script src="js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<link href='https://fonts.googleapis.com/css?family=Poiret+One' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Raleway:400,700&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class="container-fluid">
<nav id=menu class="navbar navbar-fixed-top">
<ul class="nav navbar-nav center">
<li> <a href="#yellow">Home</a>
</li>
<li> <a href="#blue">About us</a>
</li>
<li> <a href="#green">Services</a>
</li>
<li> <a href="#black">Cars</a>
</li>
<li></li>
</ul>
</nav>
</div>
<div class="container-fluid fill" id="yellow">
<div class="row">
<div class="col-md-6 col-md-offset-3 col-sm-12">
<header>All you need to do is</header>
</div>
</div>
<div class="row">
<div class="col-md-2 col-xs-12 col-md-offset-2">
<div class="glyph"><span class="glyphicon glyphicon-search"></span><h3>Search</h3></div>
</div>
<div class="col-md-2 col-xs-12 col-md-offset-1">
<div class="glyph"><span class="glyphicon glyphicon-ok"></span><h3>Choose</h3></div>
</div>
<div class="col-md-2 col-xs-12 col-md-offset-1">
<div class="glyph"><span class="glyphicon glyphicon-phone"></span><h3>Call us</h3></div>
</div>
</div>
<div class="row">
<div class="col-md-2 col-xs-12 col-md-offset-2">
<div class="description"><h3><b>Search our offers or services, any time with simple one page layout.
You don't need a search button, cause everything is right hear, on your computer screen.</b></h3></div>
</div>
<div class="col-md-2 col-xs-12 col-md-offset-1">
<div class="description"><h3><b>Maybe you can't make your decision when every product is on a different page. You can't remamber them all. That's why here everything is on One Page.</b></h3></div>
</div>
<div class="col-md-2 col-xs-12 col-md-offset-1">
<div class="description"><h3><b>Our firm is always avaliable. You need to just call us. Our Call office always will help you with choice, price and maybe you will get some discount too!</b></h3></div>
</div>
</div>
</div>
<div class="container-fluid fill" id="blue">
<div class="row"><div class="col-md-12 col-xs-12"><header>About us</header></div></div>
<div class="row"><div class="col-md-5 col-xs-12 col-md-offset-1"><section id="sec_1">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec fringilla a ex varius varius. Sed placerat, quam a aliquet consequat, dui arcu dignissim nisi, non auctor diam risus vitae dolor. Vestibulum eu egestas mi, ut pulvinar leo. Aliquam elementum tristique leo, quis ullamcorper orci consequat at. Mauris fermentum laoreet nisi, in consectetur augue mollis in. Aenean bibendum ultricies purus, a euismod nulla rutrum quis. Aliquam eleifend eros non tellus tristique pulvinar. Nulla facilisi. Pellentesque a tempus nunc. Nunc condimentum mauris quis dolor molestie, et blandit tellus dapibus. Praesent molestie magna tincidunt accumsan pretium. Suspendisse potenti. Curabitur posuere iaculis mauris eget faucibus. Ut sodales tristique turpis sed eleifend. Donec consequat tellus leo, vel tempus tellus congue nec. Integer aliquet commodo accumsan.
</section></div>
<div class="col-md-5 col-md-offset-1 col-xs-12"><section id="sec_2">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec fringilla a ex varius varius. Sed placerat, quam a aliquet consequat, dui arcu dignissim nisi, non auctor diam risus vitae dolor. Vestibulum eu egestas mi, ut pulvinar leo. Aliquam elementum tristique leo, quis ullamcorper orci consequat at. Mauris fermentum laoreet nisi, in consectetur augue mollis in. Aenean bibendum ultricies purus, a euismod nulla rutrum quis. Aliquam eleifend eros non tellus tristique pulvinar. Nulla facilisi. Pellentesque a tempus nunc. Nunc condimentum mauris quis dolor molestie, et blandit tellus dapibus. Praesent molestie magna tincidunt accumsan pretium. Suspendisse potenti. Curabitur posuere iaculis mauris eget faucibus. Ut sodales tristique turpis sed eleifend. Donec consequat tellus leo, vel tempus tellus congue nec. Integer aliquet commodo accumsan.</section></div></div>
</div>
<div class="container-fluid fill" id="green">
<div class="row">
<div class="col-md-12">
<header>What are we doing for you?</header>
</div>
<div class="row">
<div class="col-md-2 col-md-offset-2 services"><h1>First service (Image, text, slider, many option)</h1></div>
<div class="col-md-2 col-md-offset-1 services"><h1>Second service (Image, text, slider, many option)</h1></div>
<div class="col-md-2 col-md-offset-1 services"><h1>Third service (Image, text, slider, many option)</h1></div>
</div>
</div>
</div>
<div class="conteiner-fluid fill" id="black">
<div class="row">
<div class="col-md-12">
<header>Where are we</header>
</div>
</div>
<div class="row">
<div class="col-md-5 col-md-offset-1">
<div id="map">
</div>
<div class="col-md-5">
<div id="contact"></div>
</div>
</div>
</div>
</div>
<script src="smooth.js"></script>
</body>
</html>