Как обнаружить/отключить инерционную прокрутку в Mac Safari?

Ответ 1

Да и нет.

Вы можете использовать touchdown/up и прокручивать как события, чтобы искать перемещение страницы, но они не будут срабатывать, если ОС выполняет инерционный свиток. Весело, правда?

Одна вещь, которую вы можете постоянно обнаруживать, это window.pageYOffset. Это значение будет продолжать меняться, пока происходит инерционный свиток, но не будет бросать событие. Поэтому вы можете придумать набор таймеров, чтобы продолжать проверять инерционный свиток и продолжать работать до тех пор, пока страница не перестанет двигаться.

Трудный материал, но он должен работать.

Ответ 2

О, как эта проблема убивает меня:/

Я создаю "бесконечный" прокручивающий большой просмотрщик файлов.

Чтобы ухудшить ситуацию, этот редактор встроен в страницу с собственной полосой прокрутки, потому что ее больше одного экрана.

U использует прокрутку переполнения-x для горизонтальной прокрутки, но для вертикального прокрутки мне нужен текущий маркер строки (как видно из большинства современных IDE), поэтому я использую плагин jquery mousewheel и прокручиваю движущееся содержимое для высоты строки вверх или вниз.

Он отлично работает на ubuntu/chrome, но иногда на MacOS Lion/Chrome, а иногда, при прокрутке он не предотвращает прокрутку по умолчанию в элементе редактора, а событие распространяется "вверх", а сама страница начинает прокручиваться.

Я даже не могу описать, насколько это раздражает.

Что касается инерциального прокрутки, то я сам с успехом уменьшил его с помощью двух таймеров

var self = this;
// mouse wheel events
    $('#editorWrapper').mousewheel(function (event, delta, deltax, deltay) {

        self._thisScroll = new Date().getTime();


        //
        //this is entirely because of Inertial scrolling feature on mac os :(
        //
        if((self._thisScroll - self._lastScroll) > 5){
            //
            //
            // NOW i do actual moving of content
            //
            //

            self._lastScroll = new Date().getTime(); 
        }

5ms - это значение, которое, как мне показалось, наиболее естественно ощущается на моем MacBook Pro, и вам нужно быстро прокрутить колесо мыши, чтобы поймать один из них.

Даже по-прежнему, иногда на Mac-прослушиватель на обложке Mac не предотвращается по умолчанию, а страница прокручивается вниз.

Ответ 3

Ну, может быть, я ошибаюсь, я думаю, что настройки "инерции" на Mac вычисляются самой системой, браузером или любой другой программой, просто подумайте, что пользователь быстро прокручивается, вместо замедления.

Ответ 4

Я не уверен в других браузерах, но следующее событие срабатывает во время инерциального прокрутки на моем Chrome, FF, Safari (mac):

var mousewheelevt=(/Firefox/i.test(navigator.userAgent))? "DOMMouseScroll" : "mousewheel";
function scrollEE (e) {
    console.log(e);
}
window.addEventListener(mousewheelevt, scrollEE, false);

Ответ 5

У меня возникла большая проблема с анимацией объекта, основанной на позиции прокрутки после завершения прокрутки, и инерционный свиток действительно меня развязал. Я закончил вычислять скорость, чтобы определить, как долго инерциальная прокрутка будет длиться и будет использоваться, чтобы ждать до оживления.

var currentY = 0;
var previousY = 0;
var lastKnownVelocity = 0;
var velocityRating = 1;
function calculateVelocity() {
    previousY = currentY;
    currentY = $('#content').scrollTop();
    lastKnownVelocity = previousY - currentY;
    if (lastKnownVelocity > 20 || lastKnownVelocity < -20) {
        velocityRating = 5;
    } else {
        velocityRating = 1;
    }
}

$('#content').scroll(function () {
    // get velocity while scrolling...
    calculateVelocity();
    // wait until finished scrolling...
    clearTimeout($.data(this, 'scrollTimer'));
    $.data(this, 'scrollTimer', setTimeout(function() {
        // do your animation
        $('#content').animate({scrollTop: snapPoint}, 300);
    }, 300*velocityRating)); // short or long duration...
});

Ответ 6

Там есть библиотека, которая решает эту проблему.

https://github.com/d4nyll/lethargy

После его установки используйте его следующим образом:

var lethargy = new Lethargy();

$(window).bind('mousewheel DOMMouseScroll wheel MozMousePixelScroll', function(e){
  if(lethargy.check(e) === false) {
    console.log('stopping zoom event from inertia')
    e.preventDefault()
    e.stopPropagation();
  }
  console.log('Continue with zoom event from intent')
});