DOM: Поиск текущего контекста прокрутки HTML-элемента

Допустим, у меня есть следующий документ:DOM: Поиск текущего контекста прокрутки HTML-элемента

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Title</title> 
</head> 
<body> 
    <div class="scrollcontainer"> 
    ... 
    <div class="content"></div> 
    ... 
    </div> 
    ... 
</body> 
</html>

И .scrollcontainer является прокручивать div:

.scrollcontainer { 
    overflow-y: scroll; 
}

Есть ли способ, чтобы найти .scrollcontainer как текущий «контекст прокрутки» (как родительский прокручиваемый элемент) для .content?

Я ищу что-то вроде:

// Should return the element `.scrollcontainer` in this example 
document.querySelector('.content').scrollContext;

Если есть предок элемент с overflow: scroll или overflow: auto, то было бы этот элемент. В противном случае тело/html (в зависимости от браузера).

Конечно, я мог бы добавить атрибут данных (например, data-scrollcontext) в каждый контекст прокрутки, а затем найти ближайшего родителя с этим атрибутом. Но мне любопытно узнать, реализовано ли что-то подобное в DOM Api.

источник

2015-11-30 nils

Что вы подразумеваете под 'scroll context'? – Rayon

Родительский прокручиваемый элемент. Если есть элемент предка с «переполнением: прокруткой» или «переполнением: авто», тогда это будет так. В противном случае тело/html (в зависимости от браузера). – nils

Существует нет DOM API для поиска прокручиваемого контейнера. Поскольку здесь «прокручиваемое» значение имеет пропуски - должно ли оно учитываться только с помощью свойства css, например overflow: scroll, даже если оно сейчас не прокручивается, или свойство css плюс «scrollHeight> offsetHeight».

Вы можете создать пользовательскую функцию, которая пересекает предков и проверяет свойства CSS, или вы можете реализовать любую другую логику здесь.

источник

2015-11-30 12:53:38 tenbits

DOM: Поиск текущего контекста прокрутки HTML-элемента

ответ

Смежные вопросы