Scrollspy bootstrap не работает

810

29 апреля 2017, 22:49

Пытаюсь сделать подчеркнутые кнопки навигационого меню когда прокручиваешь страницу. Как только не пытался, ничего не работает.Вроде все правильно делаю, но никакого успеха. Вот немного кода:

$('body').scrollspy({ 
  target: '#navbar-example' 
});

body { 
  position: relative; 
}

<head> 
  <title>Comming Soon...</title> 
  <meta charset="utf-8"> 
  <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
  <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
  <script type="text/javascript" src="js/jquery-3.2.1.min.js"></script> 
  <script type="text/javascript" src="js/jquery-ui.js"></script> 
 
  <link href="js/jquery-ui.css" rel="stylesheet"> 
 
  <link href="js/bootstrap.css" rel="stylesheet"> 
  <script src="js/bootstrap.js"></script> 
 
  <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-T8Gy5hrqNKT+hzMclPo118YTQO6cYprQmhrYwIiQ/3axmI1hQomh7Ud2hPOy8SP1" crossorigin="anonymous"> 
 
  <link rel="stylesheet" href="style.css"> 
 
  <script> 
    //Smooth scroll 
    $(function() { 
      $('a.page-scroll').bind('click', function(event) { 
        var $anchor = $(this); 
        $('html, body').stop().animate({ 
          scrollTop: $($anchor.attr('href')).offset().top 
        }, 1500, 'easeInOutExpo'); 
        event.preventDefault(); 
      }); 
    }); 
  </script> 
 
</head> 
 
<body data-spy="scroll" data-target="#navbar-exe"> 
 
  <!--Navigation bar--> 
 
  <nav class="navbar navbar-defaul navbar-fixed-top" id="navbar-exe"> 
    <div class="container"> 
      <div class="navbar-header"> 
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse-2"> 
						<span class="sr-only">Toggle navigation</span> 
						<span class="icon-bar"></span> 
						<span class="icon-bar"></span> 
						<span class="icon-bar"></span> 
					  </button> 
        <a class="navbar-brand logo page-scroll" href="#Home">WebArtist</a> 
      </div> 
      <div class="collapse navbar-collapse " id="navbar-collapse-2"> 
        <ul class="nav navbar-nav navbar-right"> 
          <li><a href="#Home" class="page-scroll active">Home</a></li> 
          <li><a href="#About" class="page-scroll">About</a></li> 
          <li><a href="#Contact" class="page-scroll">Contact</a></li> 
        </ul> 
      </div> 
      <!-- /.navbar-collapse --> 
    </div> 
    <!-- /.container --> 
  </nav> 
  <!-- /.navbar --> 
 
  <!--Navigation bar ends here-->

Answer 1

Проблема решена! Не хвотало одной буквы в навигационной менюшке, а именно буквы Т. Вот так то, пол дня голову ломал -__________-

Создание сайта для юридической фирмы в ABCname

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

Позиция курсора в блоке x, y Jquery

Как получить положение курсора в блоке, относительно этого же блока? тобишь x и y

385

CSS

как изменить z-index углов объекта на холсте fabric.js?

Фон накрывает объекты сверху через setOverlayImage , углы для растягивания не видноМожно ли как то изменить у них z-index ?

359

Java

LEFT_OUTER_JOIN работает как INNER_JOIN

У меня имеется четыре сущности с которых я хочу вывести все поля в DTO (AllInfoView)Проблема в том, что когда я пытаюсь получить значения всех полей,...

306

Java

Java ООП(интерфейс) [требует правки]

Добрый вечер,помогите написать код пожалуйста

229