Как заставить div остановиться, когда он доходит до другого div?

Question

[nastya_zholudeva]

Нужно, чтобы элемент "Категории товаров" останавливался, когда он доходит до элемента "недавно просмотренные". Подробнее на видео
https://www.dropbox.com/s/iaowp3y2pga803l/ice_vide...

Comments

[Ярослав Иванов]

высчитывать позицию блока от родительского. Например позиция top + высота блока = высоте родительскому то делать блок прижатым к низу и уберать фиксированную позицию.

[nastya_zholudeva]

Ярослав Иванов, извините, но я не очень понимаю

[Ярослав Иванов]

nastya_zholudeva, а что тут непонятного?)

[nastya_zholudeva]

Ярослав Иванов,

Например позиция top + высота блока = высоте родительскому то делать блок прижатым к низу

[Ярослав Иванов]

nastya_zholudeva, и что тут непотяного?) если вы верстальщик то все долно быть понятно)

[nastya_zholudeva]

Ярослав Иванов, я только учусь)) Как сделать блок прижатым книзу?

[Ярослав Иванов]

nastya_zholudeva, position: absolute; bottom: 0;

[Ярослав Иванов]

nastya_zholudeva, а выщисывать высоту блока через js надо )

[nastya_zholudeva]

Ярослав Иванов, а что значит

позиция top

[Анатолий]

nastya_zholudeva, position: top;

[Ярослав Иванов]

Анатолий, Анатолий, какой еще автоперевод ? что такое position: top; ?
nastya_zholudeva, позиция считается через javascript offsetTop.
https://developer.mozilla.org/en-US/docs/Web/API/H...

[nastya_zholudeva]

Ярослав Иванов, сделала вот так

var left_sideSpace = $('.left_side').offset().top;
        var left_sideHeight = $('.left_side').height();
        var parentLeftSideHeight = $('.content').height();
        console.log('left_sideHeight', left_sideHeight, 'left_side', left_sideSpace, 'parentLeftSideHeight', parentLeftSideHeight);

Это идеальная позиция. Но ведь если я сейчас "позиция top + высота блока = высоте родительскому", но у меня явно не получится желаемое. Я где-то ошиблась?

[Ярослав Иванов]

nastya_zholudeva, Уверены, что top считается от родительского ?

[Ярослав Иванов]

nastya_zholudeva, Сделайте пример на jsfiddle.net

[nastya_zholudeva]

Ярослав Иванов, https://jsfiddle.net/Jussia/fot2wcs1/2/

Answer 1

[Антон Шейкин]

position: sticky