Страницы

Поиск по вопросам

понедельник, 15 июля 2019 г.

Overflow при загрузке страницы отображать низ

Имеется 2 вложенных div

...

.primer1 { height: 100px; overflow-y:scroll; scrollbar-arrow-color:#000000; scrollbar-base-color: #228B22; }
Содержимое primer2 по высоте больше, у него показывается верхняя часть и мы можем двигать ползунок вниз. А нужно, что бы изначально отображался низ и мы могли бы двигаться вверх.
По примеру чатов: мы должны видеть последние сообщения, а если нужно посмотреть более ранние сообщения, то прокручиваем вверх.
Как это можно реализовать?


Ответ

На чистом CSS, скорее всего такого результата легко не достичь, а если использовать JS, то для этого достаточно двух строк:
var scrollDiv = document.getElementById("scroll_div"); scrollDiv.scrollTo(0, scrollDiv.scrollHeight); .primer1 { height: 100px; overflow-y:scroll; scrollbar-arrow-color:#000000; scrollbar-base-color: #228B22; border: 1px solid black; } .primer2 { height: 300px; border: 1px solid red; }

...

Проверено в Firefox, для других браузеров может не сработать, в таком случае можно воспользоваться jQuery библиотекой

Комментариев нет:

Отправить комментарий