Определите, прокручивается ли элементCSS

Разбираемся в CSS
Ответить
Anonymous
 Определите, прокручивается ли элемент

Сообщение Anonymous »

Я ищу способ определить, прокручивается ли элемент в данном направлении. То есть, если я могу вызвать element.scrollby , чтобы прокрутить его. class = "lang-js prettyprint-override">

Код: Выделить всё

/**
* Whether the element can be scrolled.
* @param {HTMLElement} el The element.
* @param {boolean} vertical Whether the scroll is vertical.
* @param {boolean} plus Whether the scroll is positive (down or right).
* @returns {boolean} Whether the element can be scrolled.
*/
function canScroll(el, vertical = true, plus = true) {
const style = window.getComputedStyle(el);
const overflow = vertical ? style.overflowY : style.overflowX;
const scrollSize = vertical ? el.scrollHeight : el.scrollWidth;
const clientSize = vertical ? el.clientHeight : el.clientWidth;
const scrollPos = vertical ? el.scrollTop : el.scrollLeft;
const isScrollable = scrollSize > clientSize;
const canScrollFurther = plus
? scrollPos + clientSize < scrollSize
: scrollPos > 0;
return (
isScrollable &&
canScrollFurther &&
!overflow.includes("visible") &&
!overflow.includes("hidden")
);
}
фрагмент работает довольно хорошо в большинстве случаев , но, к сожалению, не все случаи. Вот пример на CodePen, где он вызывается в Document.Body и Document.body.clientheight! == Document.body.scrollheight . В этом случае он вернул true , в то время как он должен вернуть false , так как вызов document.body.scrollby ({top: 100}) не Получить любой результат.
Как я могу улучшить эту функцию CanScroll , чтобы она могла правильно обработать данное пример?

Подробнее здесь: https://stackoverflow.com/questions/792 ... scrollable
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «CSS»