一个向上滚动/一个向下滚动

时间:2016-04-14 19:56:22

标签: javascript twitter-bootstrap scroll

sections=$("section");
s=0;

$(".next").click(function() {
	if(s<sections.length-1){
	s++;
	$('html, body').animate({
		scrollTop: sections.eq(s).offset().top
	}, 500);
}});

$(".previous").click(function() {
if(s>0){
	s--;
	$('html, body').animate({
		scrollTop: sections.eq(s).offset().top
	}, 500);
}});
section{
  min-height:100vh;
}
#arrow{
    position:fixed;
    top: 100px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" >


<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

<section id="about">About Us</section>
<section id="clients">Clients</section>
<section id="workwithus">Work With Us</section>
<section id="contact">Contact US</section>
<div id="arrow">
  <a class="next">next</a>
  <a class="previous">prev</a>
</div>

我想将页面部分链接到我的滚动事件,如果我向上滚动一次,一部分应该上升,同样如果我向下滚动一次,一部分应该下来,我已经完成了点击事件工作正常,但我想要在滚动+箭头上下实现。

0 个答案:

没有答案