我希望每次用户按 j 键时滚动到div。这是它的代码。
$(function() {
function scroll(direction) {
var scroll, i,
positions = [],
here = $(window).scrollTop(),
collection = $('.message_box');
collection.each(function() {
positions.push(parseInt($(this).offset()['top'],0));
});
for(i = 0; i < positions.length; i++) {
if (direction == 'next' && positions[i] > here) { scroll = collection.get(i); break; }
if (direction == 'prev' && i > 0 && positions[i] >= here) { scroll = collection.get(i); break; }
}
if (scroll) {
$('html, body').animate({"scrollTop": $(scroll).offset().top-50});
$(scroll).css('color', 'blue');
$(scroll).mouseleave(function() {
$(this).css('color', 'black');
});
}
return false;
}
$("#next,#prev").click(function() {
return scroll($(this).attr('id'));
});
$('body').keyup(function(event) {
if (event.which == 74) {
return scroll('next');
}
});
$('body').keyup(function(event) {
if (event.which == 75) {
return scroll('prev');
}
});
});
我需要从div的offest中减去50来滚动到这个。
$('html, body').animate({"scrollTop": $(scroll).offset().top-50});
它将首次滚动,但不会滚动其余时间。我总是得到整数 218 这是要滚动到的第一个div的偏移量。 DEMO - http://jsfiddle.net/XP5sP/6/ 有人能帮助我吗?
答案 0 :(得分:1)
$(scroll).offset().top-50
完全有效,因为.top
将返回一个整数值。因此问题不在于您的代码的这一部分。
我怀疑问题与scroll
函数中的scroll
变量有关。在相同的范围内,我始终不会将我的变量命名为与我的函数名称相同。
答案 1 :(得分:1)
尝试在减号之间加一些空格,这样就不会误认为是破折号。
$('html, body').animate({"scrollTop": $(scroll).offset().top - 50});
或先将数学保存在变量中
var scrollMinusFifty = $(scroll).offset().top - 50;
$('html, body').animate({"scrollTop":scrollMinusFifty});
答案 2 :(得分:1)
问题是你总是将scrollTop
值移动到第一个匹配元素之前的50像素,因此它始终将该元素标识为您需要滚动到的元素您的if
语句,因为其位置 大于当前scrollTop
值。
将代码的相关部分修改为:
if (direction == 'next' && positions[i] > here + 50) {
scroll = collection.get(i);
break;
}
这样就可以将窗口滚动到当前元素上方50个像素。