Javascript iPhone Scroll-Effekt in einer iFrame / Javascript Mausbeschleunigung

Question

Ich versuche, das iPhone Flick / Scroll-Ereignis in einem Fenster mit JavaScript neu zu erstellen.

Beginnend mit JQuery, ich bin Messung der Beschleunigung des Maus und Offset bei Klick - Drag - Release Ereignissen mit Hilfe eines Timers:

var MouseY = {

    init: function(context) {
        var self = this;
        self._context = context || window
        self._down = false;
        self._now = 0;
        self._last = 0;
        self._offset = 0;
        self._timer = 0;
        self._acceleration = 0;

        $(self._context).mousedown(function() {self._down = true;});
        $(self._context).mouseup(function() {self._down = false;});
        $(self._context).mousemove(function(e) {self.move(e);});

    },

    move: function(e) {
        var self = this;
        self._timer++;
        self._last = self._now;
        self._now = e.clientY + window.document.body.scrollTop;
        self._offset = self._now - self._last;
        self._acceleration = self._offset / self._timer;
    },

    reset: function() {
        this._offset = 0;
        this._acceleration = 0;
        this._timer = 0;
    }
};


$(function() {
    MouseY.init();
    setInterval(function() {
        $('#info').html(
            '_acceleration:' + MouseY._acceleration + '<br />' +
            '_now:' + MouseY._now + '<br />' +
            '_offset:' + MouseY._offset + '<br />' +
            '_timer:' + MouseY._timer + '<br />'
        );
        MouseY.reset();
    }, 10);

});

Nun ist das Problem, dass die Beschleunigung in dem Bildschirm Bewegung übersetzen - Gibt es Algorithmen (Lockerung?) Oder eine Animation Bibliotheken, die mir auf diesem helfen könnten? (Ich habe sah in jQuerys .animate (), aber ich bin nicht sicher, wie es während der Ziehereignisse kontinuierlich anwenden!

Update - Endlösung hier:

http://johnboxall.github.com/iphone.html

Answer 1

diesen Link für die vollständige Erklärung von einem Ansatz Hit auf, die zu sein scheinen, was Sie suchen.

http://www.faqts.com/knowledge_base /view.phtml/aid/14742/fid/53

Hier ist ein Auszug:

  

Dieser Handler setzt dann Veranstaltung   Erfassung für Mausbewegung und speichert   Mauscursorpositionen in Variablen   mouseX und mouseY. Es beginnt dann die   Timer monitorMouse (), die Maßnahmen   Maus-Cursor-Geschwindigkeit durch die Abtastung   Werte in diesen Variablen in regelmäßigen   Intervalle. Die Variablen Mouseleft   und mouseTop jedes Samplings Maus halten   Positionen und die Abtastrate ist,   bis 100 Millisekunden in dem Satz   Variable monitor.timerDelay.

Und einige der Code des Autors:

nn4 = (document.layers)? true:false;
mouseLeft = mouseTop = mouseX = mouseY = 0;
monitor = {
    timerDelay:100,
    moveLimit:2,
    sampleLimit:10
};

function startMonitor(thisText) {
    if (!tip) return;
    toolTipText = thisText;
    writeTooltip(toolTipText);

    document.captureEvents(Event.MOUSEMOVE);
    document.onmousemove = function (evt) {
        mouseX = evt.pageX;
        mouseY = evt.pageY;
        return true;
    }
    monitorMouse();
}

function stopMonitor() {
    if (!tip) return;
    hideTooltip();
        if (monitor.timer) {
        clearTimeout(monitor.timer);
        monitor.timer = null;
    }
    document.releaseEvents(Event.MOUSEMOVE);
    document.onmousemove = null;
    monitor.slowSamples = 0;
}

function monitorMouse() {
    if (Math.abs(mouseX - mouseLeft)   > monitor.moveLimit
        || Math.abs(mouseY - mouseTop) > monitor.moveLimit)
    {
        monitor.slowSamples = 0;
    }
    else if (++monitor.slowSamples > monitor.sampleLimit) {
        showTooltip();
        return;
    }
    mouseLeft = mouseX;
    mouseTop  = mouseY;
    monitor.timer = setTimeout("monitorMouse()",monitor.timerDelay);
}

Answer 2

Hier ist, was ich gefunden, wenn für kinetische / Impuls-Scrolling-Bibliotheken suchen:

• iScroll
• Zynga Auswahlrad
• Überroll
• TouchScroll
• jScrollTouch

Answer 3

Sie können in der jQuery-Plugin namens Overscroll interessieren: http://www.azoffdesign.com/overscroll ( GitHub Seite )