Прокрутите страницу до определенной точки, затем запустите прокрутку содержимого переполнения div, используя только одну полосу прокрутки.

Question

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

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

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

Answer 1

Вы можете сделать это, используя scrollTop property ваших элементов. Сначала вы должны определить, где ваш заголовок закончился (пункт прокручивать окно в):

var header = $('#header'); 
var headerBottom = header.offset().top + header.height(); 

Тогда вы могли бы оживить скроллбар вашего окна в этой позиции:

$(window).animate({scrollTop: headerBottom}); 

После того, что было принято после чего вы получите ссылку на какой бы элемент вы хотели прокрутить и анимировать его позицию scrollTop (тот же код, что и фрагмент выше, который прокручивает window).

Наконец вы нуждаетесь в scroll event handler, чтобы вы могли определить, когда пришло время, чтобы изменить какой элемент вы прокрутки содержимого с помощью:

$(window).scroll(function(){ 
    // logic to determine which element should be scrolling 
});