我正在尝试这样做,当你点击一个文本,我希望它进一步向下动画到页面的一部分。 示例:https://osynlig.se 点击Case,你可以看到它动画到页面的那一部分。
在我的网站上。当我点击主页,信息,联系我们,我希望它动画到页面的那些部分,我不知道如何做到这一点:(
http://pixelatedore.zapto.org/看到该代码进入我的网站并执行ctrl + u
我不知道如何粘贴代码:3。
如果您可以发送链接到解释的网站,或者您知道并在评论中写下来。这将是非常高兴的。
答案 0 :(得分:4)
这样的事情?
$(document).ready(function(){
$(".anchor").click(function(e){
$('html, body').animate({
scrollTop: $($(this).attr('href')).offset().top
}, 1000);
});
});

#top{background-color:red;}
#middle{background-color:yellow;}
#bottom{background-color:green;}
div.block{height:400px;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="toppage"></div>
<a class="anchor" href="#top">
<div class="arrow-down-light-blue">top</div>
</a>
<a class="anchor" href="#middle">
<div class="arrow-down-light-blue">middle</div>
<a class="anchor" href="#bottom">
<div class="arrow-down-light-blue">bottom</div>
</a>
<div class="block" id="top">The top
<a class="anchor" href="#toppage"> Back to top</a>
</div>
<div class="block" id="middle">The middle
<a class="anchor" href="#toppage"> Back to top</a>
</div>
<div class="block" id="bottom">The bottom
<a class="anchor" href="#toppage"> Back to top</a>
</div>
&#13;