Воссоздание резюме Apple Store, которое перемещается с прокруткой страницы

Question

Я хочу создать что-то похожее на то, что Apple имеет в своем интернет-магазине для отображения сводной информации о вашем компьютере и общей суммы , как показано здесь . Я предполагаю, что это JavaScript, но было бы еще круче, если бы это можно было сделать в CSS.

Обычно я хотел бы, чтобы что-то прокручивалось на странице, например position:fixed, но я не хочу, чтобы оно начинало двигаться, пока пользователь не прокрутит определенную позицию.

Я использую jQuery, так что плагин jQuery тоже подойдет.

Answer 1

Попробуйте что-то вроде этого

var min = 10; //Set your own here
$(window).scroll(function() { 
  var scrollTop = $(window).scrollTop()
  if(scrollTop > min)
    $('.divClass').css({  top: "0" });
  else
    $('.divClass').css({ top: (min - scrollTop) + "px" });
});

CSS

.divClass
{
  position:fixed,
  left: 500px /* or whatever */
}