首页前端开发HTML如何使用

如何使用

时间2024-01-23 19:08:17发布访客分类HTML浏览471
导读：收集整理的这篇文章主要介绍了如何使用<nav>链接实现滚动到页面某一部分，觉得挺不错的，现在分享给大家，也给大家做个参考。随着一页网站的出现，使用滚动作为导航长页面的方法变得越来越流行。这一小部分是用JS + jquery代码实...
收集整理的这篇文章主要介绍了如何使用nav> 链接实现滚动到页面某一部分，觉得挺不错的，现在分享给大家，也给大家做个参考。随着一页网站的出现，使用滚动作为导航长页面的方法变得越来越流行。这一小部分是用JS + jquery代码实现的，您可以轻松地在nav元素中设置链接以滚动到页面的相应部分。如果您希望在JS不存在时将锚标记添加到页面中。

Coffeescript：

$("nav").find("a").click (e) ->
        e.preventDefault()    section = $(this).attr "href"    $("htML, body").aniMATE        scrollTop: $(section).offset().top

或JS：

$("nav").find("a").click(function(e) {
        e.PReventDefault();
        VAR section = $(this).attr("href");
    $("html, body").animate({
        scrollTop: $(section).offset().top    }
    );
}
    );

和一些示例HTML

nav>
        a href="#welcome">
    Welcome/a>
        a href="#about">
    About/a>
        a href="#section3">
    Section 3/a>
    /nav>
    div id="welcome">
    Welcome to this websITe/div>
    div id="about">
    About this website, and such/div>
    div id="section3">
    The third section/div>

以上就是如何使用nav> 链接实现滚动到页面某一部分的详细内容，更多请关注其它相关文章！

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！

"

若转载请注明出处： 如何使用