本文实例讲述了jquery实现平滑滚动到指定锚点的方法。分享给大家供大家参考。具体如下:
定义好指定的anchor锚点,调用下面的js代码可以让页面平滑的滚动到指定的位置,非常实用,比如返回页面顶部,去往页面底部等功能
// HTML:
// <h1 id="anchor">Lorem Ipsum</h1>
// <p><a href="#anchor" class="topLink">Back to Top</a></p>
<div class="aritcle_card">
<a class="aritcle_card_img" href="/ai/2393">
<img src="https://img.php.cn/upload/ai_manual/001/246/273/176352304574139.png" alt="LibLibAI">
</a>
<div class="aritcle_card_info">
<a href="/ai/2393">LibLibAI</a>
<p>国内领先的AI创意平台,以海量模型、低门槛操作与“创作-分享-商业化”生态,让小白与专业创作者都能高效实现图文乃至视频创意表达。</p>
<div class="">
<img src="/static/images/card_xiazai.png" alt="LibLibAI">
<span>159</span>
</div>
</div>
<a href="/ai/2393" class="aritcle_card_btn">
<span>查看详情</span>
<img src="/static/images/cardxiayige-3.png" alt="LibLibAI">
</a>
</div>
$(document).ready(function() {
$("a.topLink").click(function() {
$("html, body").animate({
scrollTop: $($(this).attr("href")).offset().top + "px"
}, {
duration: 500,
easing: "swing"
});
return false;
});
});希望本文所述对大家的jQuery程序设计有所帮助。
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移,垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是,许多工具可以让 Windows 保持平稳运行。
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号