Domanda

Sto cercando di scorrere il corpo di una pagina che sto costruendo su e giù mentre il dispositivo si inclina su e giù.

Questo plug -in scorre a sinistra e a destra come un dispositivo inclinati.

Come posso farlo scorrere su e giù con l'inclinazione su e giù?

(function($) {
$.fn.tilt = function(params) {
    items = this;

    params = $.extend( {sensitivity: 1}, params);

    ax = ay = 0;

    window.addEventListener('devicemotion', function (e) {
        ax = e.accelerationIncludingGravity.x * params.sensitivity;
        ay = -e.accelerationIncludingGravity.y * params.sensitivity;

        if(ax > 0) {
            ax -= params.sensitivity;
            if(ax < 0) ax = 0;
        } else if(ax < 0) {
            ax += params.sensitivity;
            if(ax > 0) ax = 0;
        }

    }, false);

    mainLoop = setInterval("moveMe()");

    moveMe = function() {
        $(items).each(function() {
            scrollPos = $(this).scrollLeft() + ax;
            $(this).scrollLeft(scrollPos);
        });
    }
}
})(jQuery);
È stato utile?

Soluzione

Fai la stessa cosa ma con il parametro Y?

(function($) {
$.fn.tilt = function(params) {
    items = this;

    params = $.extend( {sensitivity: 1}, params);

    ax = ay = 0;

    window.addEventListener('devicemotion', function (e) {
        ax = e.accelerationIncludingGravity.x * params.sensitivity;
        ay = -e.accelerationIncludingGravity.y * params.sensitivity;

        if(ay > 0) {
            ay -= params.sensitivity;
            if(ay < 0) ay = 0;
        } else if(ay < 0) {
            ay += params.sensitivity;
            if(ay > 0) ay = 0;
        }

    }, false);

    mainLoop = setInterval("moveMe()");

    moveMe = function() {
        $(items).each(function() {
            scrollPos = $(this).scrollTop() + ay;
            $(this).scrollTop(scrollPos);
        });
    }
}
})(jQuery);

Altri suggerimenti

Se stai usando jQuery, perché non usare $ .SCrolltop () Per modificare il valore di scorrimento verticale dell'elemento?

var tilt_interval_id = setInterval(function(items) { onDeviceTilt(items); }, 50);    

function onDeviceTilt(items) {
   $(items).each(function() {
      var newScrollX = $(this).scrollLeft() + ax;
      var newScrollY = $(this).scrollTop() + ay;
      //Update the horizontal and vertical scroll positions
      $(this).scrollLeft(newScrollX);
      $(this).scrollTop(newScrollY);
   });
}

//Later, if you wish to clear the interval ...
clearInterval(tilt_interval_id);
Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top