Поддерживать положение прокрутки для div на основе положения полосы прокрутки

У меня есть мой код, написанный здесь.

setInterval(
    function (data){
        var alreadyScrolled = $("#smallBox").height() >= $("#smallBox").get()[0].scrollHeight;


        $("#smallBox").append(data + "<br />");
        if (alreadyScrolled) {
            $("#smallBox").scrollTop($("#smallBox").heightoffsetHeight)
        }
    },
    1000, 
    Date()
);


<div id="largeBox">
    <div id="smallBox">
    </div>
    <input />
</div>

Я пытаюсь определить, находится ли полоса прокрутки внизу окна, и, если это так, добавить новые данные в div, а затем прокрутить вниз до нижней части. Если свиток не находится внизу, ничего не делать.

Я не уверен, какие части API DOM или JQuery я могу использовать для достижения этой цели, я пробовал несколько вещей и несколько застрял здесь, кажется, ничто не дает мне значения с точки зрения того, где находится полоса прокрутки, и сколько я могу прокрутить. Процентное значение было бы здорово, если бы я мог просто получить это.

Я не хочу использовать какие-либо библиотеки за пределами jQuery, это также означает отсутствие плагинов.

Я рассчитываю на то же поведение, которое мы наблюдаем в комнатах чата SO, за исключением того, что, похоже, он использует плагин ScrollTo для выполнения своих задач.

Обновить.

Я не могу просто использовать.height() и.scrollTop, они не совпадают.

Смотрите это: http://jsfiddle.net/qSx3M/6/

4 ответа

Решение

Я думаю, это то, что вы после?

http://jsfiddle.net/qSx3M/7/

Код:

var alreadyScrolled = $("#smallBox")[0].scrollTop + $("#smallBox").height() == $("#smallBox")[0].scrollHeight;

Взял свой код и сделал небольшие модификации. Не могу сказать, хороший ли это код, но он работает

setInterval(
    function (data){
        var alreadyScrolled = $("#smallBox").height() + $("#smallBox").get()[0].scrollTop >= $("#smallBox").get()[0].scrollHeight;

        console.log(alreadyScrolled);

        $("#smallBox").append(data + "<br />");
        if (alreadyScrolled) {
            $("#smallBox").get()[0].scrollTop = $("#smallBox").get()[0].scrollHeight;
        }
    },
    1000, 
    Date()
);

Обычное старое значение прокрутки JavaScript:

var scrollVal = myDivElem.scrollTop;

Попробуй это

var $this;
  $('#container').scroll(function(){
    $this = $(this);
    if ($this.scrollTop() > $this.height()){
       //Do something here
    }
});
Другие вопросы по тегам