美文网首页Web 前端开发 让前端飞
jQuery点击锚点平滑滚动

jQuery点击锚点平滑滚动

作者: 砚婉儿 | 来源:发表于2017-03-27 15:37 被阅读0次

点击锚点平滑滚动到相应页面位置

$(function() {
    $("a.link").click(function() {
        $("html, body").animate({
            scrollTop: $($(this).attr("href")).offset().top + "px"
        }, {
            duration: 500,
            easing: "swing"
        });
        return false;
    });
});

.
.

"返回顶部"按钮效果
向下滚动页面出现 按钮,点击返回顶部。

$(function() {
  $(window).scroll(function() {
    if ($(window).scrollTop() >= 100) {
      $('#go-top').fadeIn(300);
    } else {
      $('#go-top').fadeOut(300);
    }
  });
  $('#go-top').click(function() {
    $('html,body').animate( {
      scrollTop : '0px'
    }, 0);
  });
});

…………END…………

谢谢支持,喜欢就点个❤

相关文章

网友评论

    本文标题:jQuery点击锚点平滑滚动

    本文链接:https://www.haomeiwen.com/subject/dnsrottx.html