прокрутите до 50% полосы прокрутки div - PullRequest
0 голосов
/ 27 мая 2020

Допустим, я хотел прокрутить до 50% div, например, если div переполняется, я хочу прокрутить до половины полосы прокрутки, чтобы она была посередине. Как мне это сделать?

<div id = "container">
<canvas/>
</div>

<style>
#container {
width: 80vw;
height: 100vh;
overflow: scroll;
}

</style>

1 Ответ

0 голосов
/ 27 мая 2020

Кажется, на подобный вопрос есть ответ, который вы ищете. Невозможно воссоздать желаемый эффект с помощью CSS, но вы можете добиться его с помощью Javascript или jQuery. См. Следующий вопрос: Как установить позицию прокрутки div с переполнением div внутри него?

EDIT 02/06/2020:

Если не Если хотите использовать JQuery, то как насчет использования простого JavaScript?

<script type="text/javascript">
  elm = document.getElementById('container');
  elm.addEventListener("overflow", scroll());

  function scroll() {
    vertical_shift = elm.scrollHeight / 2;
    elm.scrollTo(0, vertical_shift)
  }
</script>

Этот метод определит, существует ли переполнение, и вызовет функцию scroll (), которая затем сдвинет полосу прокрутки наполовину вниз вертикально.

Однако этот метод не будет работать, если вы внесете изменения в контекст #container. Для этого я бы также применил прослушиватель событий для изменения контекста.

...