>  Q&A  >  본문

javascript - 单页整站导航点击滚动的代码有现成的库吗?

要做个单页的网站,在点击导航的时候网页自动定位滚动到相应内容是怎么实现的? 有没有这样的JS库?

刚搜了一下很多都是类似swiper.js的效果,都是整屏滚动切换的。

我需要类似锚点效果一样,滚动到相应位置,不是全屏都切换。

求推荐。

运行到这句的时候报错,说没有top这个属性,这是哪的问题?

调试了一下,发现$(target).data("to");的值没有获取到,然而我加了data属性啊。

<a href="#" data-to="dvAboutUs">

搞定了
<span><img data-to="dvAboutUs" src="images/mainUI/navItem4.gif" /></span>

调试时候发现虽然我监听的a标签,可点击事件里的target是img,于是把data属性放到图片里就好了。

高洛峰高洛峰2770일 전271

모든 응답(4)나는 대답할 것이다

  • ringa_lee

    ringa_lee2017-04-11 11:55:22

    导航

    <p class='nav-left'>
        <p data-to='content1'><\p>
        <p data-to='content2'><\p>
    <\p>
    

    内容

    <p class='content1'>
    <p class='content2'>
    

    js

    $('.nav-left').on('click','p',function(e){
                //console.log(e);
                var target = e.target;
                var p = $(target).data("to");
                //console.log(p);
                
                $('html,body').animate({scrollTop:$('.'+p).offset().top}, 800);
            });
    

    회신하다
    0
  • 阿神

    阿神2017-04-11 11:55:22

    用jquery就几句代码,用原生js代码多点,也不是很复杂

    회신하다
    0
  • 迷茫

    迷茫2017-04-11 11:55:22

    顶上来~ 在线等

    회신하다
    0
  • 高洛峰

    高洛峰2017-04-11 11:55:22

    fullpage.js

    회신하다
    0
  • 취소회신하다