Question

我正在尝试使用jQuery animate方法，但它无法正常工作。我尝试过使用自调用函数和函数声明，但它仍然无效感谢您的帮助。

 <ul id='menu-list'>
                        <li><a href="index.html">Home</a></li>
                        <li><a href="#" class='page-link' id='about' data-value='services'>About</a></li>
                        <li><a href="#" class='page-link' data-value='team'>Team</a></li>
                        <li><a href="#" class='page-link' data-value='search'>Search</a></li>
                        <li><a href="#" class='page-link' data-value='contact'>Contact</a></li>
                    </ul>
                    
                    
                    <div id="main-services" class='services'></div>
                    <div id='services-container' class='search'></div>
                    <div id='team' class='team'></div>
                    <div id='contact' class='contact'></div>

`enter code here`

(function () {
  
    var links = $('.page-link');
 
    for (var i = 0; i < links.length; i++) {
      
        links[i].onclick = function () {
          
            var data = this.getAttribute('data-value')
            
            $('body').animate({
              
                scrollTop: $('.' + data).offset().top
              
            }, 800);
        };
    }
})();

Answer 1

您是否只想在class=page-link的每个项目上添加onClick功能？

只需尝试这样做：

var links = $('.page-link'); 

links.on('click', function(){
    var data = $(this).attr('data-value');
    $('html, body').animate({
        scrollTop: $('.' + data).offset().top
    }, 800);
});

尝试了一点不同的语法。还可以使用选择器＆＃39; html，body＆＃39;关于动画功能。

jQuery的动画方法不起作用？

1 个答案: