使用<nav>链接滚动到页面相应部分的方法-创新互联
小编给大家分享一下使用
创新互联是专业的新邵网站建设公司,新邵接单;提供成都网站建设、成都网站设计,网页设计,网站设计,建网站,PHP网站建设等专业做网站服务;采用PHP框架,可快速的进行新邵网站开发网页制作和功能扩展;专业做搜索引擎喜爱的网站,专业的做网站团队,希望更多企业前来合作!随着网站页面的出现,使用滚动作为导航长页面的方法变得越来越流行。使用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代码:
Welcome to this websiteAbout this website, and suchThe third section
看完了这篇文章,相信你对使用
网站栏目:使用<nav>链接滚动到页面相应部分的方法-创新互联
网站路径:http://myzitong.com/article/cdhocd.html