滚动动画不应用于第一个菜单项的顶部

时间:2016-08-29 07:51:25

标签: javascript jquery wordpress

我设法将此处抓取的片段实现到我的WordPress网站: http://scentology.burnnotice.co.za/

$("#primary-menu > li > a").on("click", function(event){
  event.preventDefault();
  var bookMark = $(this).attr("href").substring(1,$(this).attr("href").length);
  bookMarkTag = $("a[name='"+ bookMark +"']");
  if(bookMark !== undefined) {
    $('html,body').animate({scrollTop: bookMarkTag.offset().top}, Math.floor(bookMarkTag.offset().top));
  }         
});

当我点击一个菜单项时,它会将我引导到正确的部分。唯一的问题是当我点击Home项时,它会滚动回到顶部,但动画不适用,所以它太快了。 如何将动画应用到主菜单项?

1 个答案:

答案 0 :(得分:1)

请您尝试下面适合我的代码。您可以根据需要更改 animateSpeed

$("#primary-menu > li > a").on("click", function(event){
    event.preventDefault();
    var bookMark = $(this).attr("href").substring(1,$(this).attr("href").length);
    bookMarkTag = $("a[name='"+ bookMark +"']");
    if(bookMark !== undefined) {
        $('html,body').animate({scrollTop: bookMarkTag.offset().top}, Math.floor(bookMarkTag.offset().top));
    }         
});

替换为

$("#primary-menu > li > a").on("click", function(event){
    event.preventDefault();
    var bookMark = $(this).attr("href").substring(1,$(this).attr("href").length);
    bookMarkTag = $("a[name='"+ bookMark +"']");
    var animateSpeed = 500;
    if(bookMark !== undefined) {
        $('html,body').animate({scrollTop: bookMarkTag.offset().top}, animateSpeed );
    }
});