javascript - 滚动动画未应用于第一个菜单项的顶部

标签 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));
  }         
});

当我单击菜单项时,它会完美地引导我到正确的部分。唯一的问题是,当我单击“主页”项时,它会滚动回顶部,但动画不适用,因此速度太快。 如何将动画也应用到主菜单项?

最佳答案

您能否尝试下面的代码,它对我有用。您可以根据需要更改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 );
    }
});

关于javascript - 滚动动画未应用于第一个菜单项的顶部,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39201096/

相关文章:

javascript - JQuery.append() - 如何在没有 ID 的情况下追加

javascript - 使用 javascript/jQuery 设置 <object> 的数据属性

html - 列出 li 第一个元素 css float 不工作

php - 我如何在 wordpress/php 中测试 jpg 图像的 cmyk 或 rgb 颜色模式?

java - 使用 ScriptEngine 从 JavaScript 调用 Java 方法

javascript - 在单个 anchor 标记中一起使用 href 和 onclick 可以吗?

javascript - 没有 hack 或其他路由器的 Backbone.js 和 jQueryMobile 路由

jquery - css中的动画延迟

javascript - 交叉请求错误: "Origin is not allowed by Access-Control-Allow-Origin"?

php - 不确定将我的自定义帖子类型的代码放在哪里?