1
我试图在点击滚动到div的底部时得到一个自动滚动。我有它的工作,但它一次只能滚动600px,因为这是我的设置。我只是不知道如何让它直接滚动到一次点击底部的股利。这是我迄今为止。我不知道是否有更简单的方式来编写我所做过的jQuery代码。滚动到div的底部
$('.scroll-down').on('click', function() {
var currentScrollPosition = 0;
currentScrollPosition += 600;
$('.bx-viewport').animate({
scrollTop: currentScrollPosition
}, 2000);
});
$('.scroll-up').on('click', function() {
var currentScrollPosition = 0;
currentScrollPosition -= 600;
$('.bx-viewport').animate({
scrollTop: currentScrollPosition
}, 2000);
});
.bx-viewport {
height: 600px !important;
overflow: auto !important;
width: 100%;
position: relative
}
.scroll-up {
position: absolute;
top: 20px;
right: 100px;
cursor: pointer;
color: rgba(0, 0, 0, 0.5);
}
.scroll-down {
position: absolute;
top: 40px;
right: 100px;
cursor: pointer;
color: rgba(0, 0, 0, 0.5);
}
img {
height: 900px;
overflow: auto;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="bx-viewport">
<img src="http://placehold.it/200x1000" />
</div>
<div class="scroll-down">scroll down</div>
<div class="scroll-up">scroll up</div>