标签搜索

jquery 点击锚点事件并取消scroll事件,平滑滚动至锚点位置

sunshine
2024-04-25 / 0 评论 / 126 阅读
温馨提示:
本文最后更新于2024年04月28日,已超过206天没有更新,若内容或图片失效,请留言反馈。

在jQuery中,如果你想要取消由锚点点击触发的滚动事件,你可以使用event.preventDefault()方法来阻止默认的滚动行为。以下是一个简单的例子:

$(document).ready(function(){
  $('a[href*="#"]').click(function(event){
    // 阻止默认的点击事件
    event.preventDefault();
 
    // 获取目标位置
    var target = $(this.hash);
    target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
 
    // 执行平滑滚动
    if (target.length) {
      $('html, body').animate({
        scrollTop: target.offset().top
      }, 1000);
    }
  });
});
感觉很棒,欢迎点赞 OR 打赏~
1
分享到:

评论 (0)

取消