Как заставить div прокручивать страницу вниз, когда она достигает верхней части страницы?

Я знаю, что название немного сбивает с толку; D, но в основном то, что я хочу сделать, ясно продемонстрировано на этом сайтеhttp://9gag.com прокрутите вниз и обратите внимание на боковую панель, есть 2 объявления, как только второе объявление достигает верхней части страницы, оно начинает прокручиваться вниз со страницей.

Я хотел бы знать, как это сделать? Решения html / css или jQuery являются предпочтительными.

 Kevin B22 дек. 2011 г., 19:34
Самый простой способ - прослушать событие прокрутки тега body, затем, когда scrollTop превысит определенное количество, добавить класс к объявлению, фиксируя его позицию, затем удалить класс, когда scrollTop вернется к значению ниже этого значения. У меня нет кода для отправки в качестве образца, поэтому я не буду публиковать его в качестве ответа.
 Ilja22 дек. 2011 г., 19:37
@KevinB Спасибо, но я не очень хорошо разбираюсь в коде, поэтому я бы предпочел код, но спасибо за логику!

Ответы на вопрос(2)

Решение Вопроса

вам нужно выслушать документscroll мероприятие. Когда это произойдет, вы захотите посмотреть на значениеscrollTop.

$(document).scroll(function() {

    var useFixedSidebar = $(document).scrollTop() >= myThresholdValue;
    $('.my-sidebar-items').toggleClass('fixed', useFixedSidebar);

});

И ваш CSS в основном будет выглядеть так:

.my-sidebar-items.fixedSidebar { position: fixed; }

Осложняющим фактором является то, что вы, вероятно, захотите, чтобы элементы были зафиксированы на своих новых, верхних позициях, и вы захотите сделать что-то вроде этого:

.my-sidebar-items.fixedSidebar { position: fixed; top: 0 }

Тем не менее, это, вероятно, сложит ваши предметы друг на друга. Решением этой проблемы было бы поставитьfixedSidebar класс на контейнере, и используйте класс, как описано.

демонстрация

 Ilja22 дек. 2011 г., 19:47
Сейчас попробую thnx

Ваш ответ на вопрос