exxxcitation1
@exxxcitation1
Ваше Эникейшество

Как зафиксировать scroll элемента в определённой позиции, если элемент не ререндерится после перезагрузки?

Есть элемент с текстом, который перегружен. Т.е. текст не влезает в рамки блока. Естественно, стоит
overflow: scroll

Смысл в том, что текст нормально скроллится, но отображается конец этого текста, а нужно, чтобы отображалось начало, а не хвосты.

Функциональный элемент, в котором я его поместил - имеет вот такой вот код, который этот скролл устанавливает в нужную позицию:
document.querySelectorAll("[id='name']").forEach((e) => {
    e.scrollLeft = -parseInt(getComputedStyle(e).width);
  });


При переходе в этот компонент через роут, т.е. по клику на какую-либо кнопку - скроллы устанавливаются как надо.
НО если я перезагружу страницу, то они уйдут восвояси. И при каждой перезагрузке страницы это происходит таким образом.

Не хотелось бы постоянно переотрисовывать элемент с помощью каких-то махинаций со стейтом, юзэффектами.
Хотя если есть такое решение, то буду благодарен, ибо пробовал через них - тоже не получилось.
Возможно, что есть другой способ установить позицию скролла. На уровне css, допустим.
Хотя такого я не нашёл.
Возможно я вообще не прав и это не связано с ререндером.

61714497c3b2b392700789.png
617144d7160c4516937925.png
617144a2d3016471671657.png
  • Вопрос задан
  • 45 просмотров
Пригласить эксперта
Ответы на вопрос 1
Wacdis
@Wacdis
Web Development fan
<div style="overflow-x: scroll; width: 100px;">
	<div style="white-space: nowrap;">asdasfasdgafdgsdhfghssdfkjhalwejghrlakjsbdf.kbasdf!</div>
</div>
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы