Как у вас есть плавающий / фиксированный элемент на веб-странице в зависимости от того, какая часть страницы видна?

Question

Вопрос сбивает с толку, я знаю, но я просто не могу сказать иначе.

Вот URL: Настройка - Apple Store (США)

Поле «Сводка» сбоку выровнено под подзаголовком (с изображениями всех моделей Mac) и находится на той же высоте, что и блок контента. Если вы прокрутите страницу вверх, вся страница поднимется, как и ожидалось. Однако в тот момент, когда блок контента прокручивается из видимой области окна браузера, сводный блок привязывается к верхнему уровню и остается там, даже если вы прокручиваете в дальний конец страницы.

Как называется это поведение и каков самый простой и чистый способ его достижения? Я бы предпочел плагин jQuery и / или фрагмент кода вместо простого JavaScript.

Answer 1

Вы можете сделать что-то вроде этого:

$(function () { 
  var $el = $('.fixedElement'), 
      originalTop = $el.offset().top;  // store original top position

  $(window).scroll(function(e){ 
    if ($(this).scrollTop() > originalTop ){ 
      $el.css({'position': 'fixed', 'top': '0px'}); 
    } else { 
      $el.css({'position': 'absolute', 'top': originalTop}); 
    } 
  }); 
});

Проверьте пример здесь .

Answer 2

Я думаю, что вы ищете

JQuery-прокрутки следуют

плагин