JavaScript Краевого эффект

Question

Я хотел бы знать, если есть какая-либо библиотека JavaScript, чтобы выполнять те же эффекты в смартфонах при прокрутке от границы,

графического эффект используется по краям прокрутки виджетов, когда пользователь прокручивает, выходящий за рамками границы содержимого в 2D пространстве. https://developer.android.com/reference/android/widget/EdgeEffect.html

Я ищу его через интернет, но не смогли найти ничего подобного пока нет.

Answer 1

Если вы ищете упругий эффект ...

Такого эффекта требует поддержки так называемых overscroll на элементах DOM - по существу это означает, что вы должны быть в состоянии установить document.body.scrollTop до отрицательного значения. Но вы не можете сделать это в стандарте DOM:

$(function() { 
 
    document.body.scrollTop = -20; 
 
    $("#sp").html("Scroll position=" + document.body.scrollTop); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div id=sp> 
 
    Scroll position 
 
</div>

Вам нужно будет анимировать document.body.scrollTop < 0 для достижения анимированного упругого эффекта.

Помимо отрицательных значений прокрутки требуется специальный тип полосы прокрутки. Классические полосы прокрутки по умолчанию не предназначены для отображения позиций скроллинга.

В идеале, для достижения такого эффекта вам понадобится поддержка браузера.

Как и в моем Sciter Я ввел overlow:scroll-indicator; свойство CSS для поддержки такой легкой полосы прокрутки с анимированным эффектом «вернуться». Вот скриншот взят в момент overscroll (обратите внимание на первый пункт с верхней частью списка):

В принципе в браузерах можно добиться такого эффекта с использованием анимированных transform:translate() и пользовательской прокрутку Как бы ни рисовать, но я не видел ничего подобного ...