JQuery простое мобильное перемещение по экрану - PullRequest
Новая
       37

JQuery простое мобильное перемещение по экрану

0 голосов
/ 16 декабря 2018

Я использую следующий код для перелистывания next / previous со страницами, имеющими href "next" и "prev" ": 

jQuery(function( $ ) {
var keymap = {};

// LEFT
keymap[ 37 ] = "#prev";
// RIGHT
keymap[ 39 ] = "#next";

$( document ).on( "keyup", function(e) {
var href,
    selector = keymap[ e.which ];
// if the key pressed was in our map, check for the href
if ( selector ) {
    href = $( selector ).attr( "href" );
    if ( href ) {
        // navigate where the link points
        window.location = href;
    }
}
});
});

Я пытаюсь добавить другой скрипт, чтобы опцияпроведите пальцем, используя тот же id «next» / «prev», который работает на мобильных устройствах, таких как Android и iPhone ... и т. д. Я попробовал некоторые из следующих действий, но не смог заставить их работать. Не могли бы вы отредактировать скрипт или показать мненовый, который это делает (jsfiddle)? 

$(document).on("pageinit",function(){

  var pathname = $(location).attr('href');
  var left = $('#prev').attr("href");
  var right = $('#next').attr("href");

  $("body").on("swiperight",function(){
    <!--alert("You swiped right!");-->
    location.href=right;
  });                       
  $("body").on("swipeleft",function(){
    <!--alert("You swiped left!");-->
    location.href=left;
  });
});
  });

Или 

var start = null;
 window.addEventListener("touchstart",function(event){
     document.body.innerHTML = "touch";
   if(event.touches.length === 1){
       document.body.innerHTML = " single touch";
      //just one finger touched
      start = event.touches.item(0).clientX;
    }else{
    start = null;
    }
  });

window.addEventListener("touchend",function(event){
    var offset = 100;//at least 100px are a swipe
    if(start){
        document.body.innerHTML = " single touch end";
      //just one finger touched
      var end = event.changedTouches.item(0).clientX;

      if(end > start + offset){
       //a left -> right swipe
      document.body.innerHTML = "next";
      }
      if(end < start - offset ){
       //a right -> left swipe
       document.body.innerHTML = " prev";
      }
    }
  });
...