Fixed относительно родителя?

Question

[Сергей]

Добрый день, как можно зафиксировать элемент относительно родителя, но что-бы он не выходил за родителя?


Мне нужно что-бы при прокрутке экрана вверх/вниз линейка была фиксирована и создавалось впечатление, что линейка "скручивается" и "раскручивается".
Сейчас при position:fixed элемент выходит за пределы родителя
https://jsfiddle.net/3m4d051y/

Comments

[Сергей delphinpro]

Сейчас при position:fixed элемент выходит за пределы родителя

Естественно. fixed фиксирует относительно окна.

[Алексей]

JS наше все.

[Сергей]

Сергей delphinpro, а как выйти из ситуации и обойтись малой кровью?)

[Сергей]

Алексей, Мб есть какой-то пример?)

[Алексей]

Сергей, есть эффект Paralax, Вам что то похожее нужно сделать. Конкретно для данной задачи нет, но опыт даст фору в будущем.

[Сергей delphinpro]

Сергей, не заморачиваться с css и отслеживать скролл страницы джаваскриптом.

Answer 1

[igumenov]

.parent{
  position: relative;
  text-align: center;
  margin-top: 200px;
  border: 1px solid #000;
  padding-top: 200px;
  margin-bottom: 200px;
  overflow: hidden;
  height: 600px;
  
}
.lineika{
  position: absolute;
  top: 0px;
  left: 0;
}
.lebedka{
  position: fixed;
  left: 0;
  bottom: 0;
  
}