jQuery的页面动画不是动画

问题描述:

这是我的。
点击功能可以工作并跳转到该部分的部分,但滚动动画不起作用。jQuery的页面动画不是动画

我做错了什么?

<nav class="navbar navbar-inverse navbar-fixed-top" id="my-navbar"> 
     <div class="container text-right"> 
      <div class="navbar-header"> 
       <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse"> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
       </button> 

      </div> 

<div class="collapse navbar-collapse text-left" id="navbar-collapse" > 
    <ul class="nav navbar-nav"> 
    <li><a href="#home">Home</a></li> 
    <li><a href="#skills">Skills</a></li> 
    <li><a href="#feedback">Feedback</a></li> 
    <li><a href="#about">About me</a></li> 
    <li><a href="#contact">Contact</a></li> 
    </ul> 
</div> 

<script> 
    $("#navbar").on("click", function(e) { 
    e.preventDefault(); 
    var section = $(this).attr("href"); 
    $("html, body").animate({ 
     scrollTop: $(section).offset().top 
    }, 1500); 
    });  
</script> 

还有就是你的页面上的任何元素#navbar,因此点击事件永远不会被解雇,并在浏览器的行为只是像往常一样(跳转到锚) - 使用类似#navbar-collapse,或.nav a尝试。

更改了jQuery是这样的:

$(".navbar-nav a").on("click", function(e) { 
    e.preventDefault(); 
    var section = $(this).attr("href"); 
    $("html, body").animate({ 
     scrollTop: $(section).offset().top 
    }, 1500); 
    }); 

你的选择是错误的。您没有编号为navbar的元素,这意味着您的事件侦听器甚至没有触发。这就是为什么它不动画。