锚点 缓动

本文介绍了如何使用jQuery实现页面锚点功能,并结合缓动效果,为用户提供平滑的页面滚动体验。通过HTML布局和jQuery代码,可以轻松创建锚点链接,当点击时,页面将缓缓滚动到相应的位置。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

页面实现 锚点,缓动滚动页面

html 布局


<a class="anchor-B2C" href="javascript:;"></a>

 <!-- 跳转部分 -->
 <h3 id="anchor-B2C"></h3>


用 jquery 实现

// 锚点缓动动画
$( function () {
    var b = ( window.opera ) ? ( document.compatMode === 'CSS1Compat' ? $( 'html' ) : $( 'body' ) ) : $( 'html,body' )
    $( '.anchor-B2C' ).click( function () {
        top( '#anchor-B2C' )
    } )

    function top ( a ) {
        b.animate( {scrollTop: $( a ).offset().top - 80}, 1000 )
        return false
    }
} )

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值