jQuery - если я перемещаю div с помощью клавиатуры

Question

Если у меня есть div с фиксированной высотой и шириной, который я перемещаю с помощью нажатия клавиши (или keydown / keyup). Могу ли я получить окно, чтобы «следовать» за этим div?

Я знаю, что вы можете автоматически прокручивать страницу, но можете ли вы получить координаты div и прокручивать страницу при перемещении div?

Answer 1

В одну сторону:

$(document.body).bind('keydown', function(){
    $('#somediv')[0].scrollIntoView(true);
});

В другую сторону:

$(document.body).bind('keydown', function(){
    $('#somediv').css('top', $(window).scrollTop() + 'px');
});

Плавный путь:

$(document.body).bind('keydown', function(){
    $('#somediv').animate({'top': $(window).scrollTop() + 'px'}, 1000);
});

Answer 2

вы используете фреймворк javascript?Если вы используете jQuery, вы можете получить позицию div, используя:

jQuery('#yourdiv').position().top()
jQuery('#yourdiv').position().left()

Кроме того, если вы используете jQuery, окно автоматически прокрутится, чтобы сохранить Div в поле зрения в любом случае без дальнейшей работы с вашей стороны.

В ответ на ваш комментарий:

Вы можете использовать jQuery ('body'). Animate ({scrollTop: xPosOfDiv});

Answer 3

var pos = $("#theDiv").position();
window.scrollTo(pos.left, pos.top);