Question

我正在使用图书馆touchSwipe.js创建一个滑动页面系统。

根据我的方法，我可以在页面之间切换，但是我无法想出要正确地回到上一页。

现在，如果我向右和向左滑动几次，计数系统就会对滑动进行总结。如何才能使计数系统正常运行以便在页面之间移动？

var swipeRight = 0;
var swipeLeft = 0;
var swipePage = 0;

function swipe1(event, direction, distance, duration, fingerCount) {

  if (direction == "left") {
    swipeLeft++;
    if (swipeLeft == 5) {
      swipeLeft = 0;
    }
  }

  if (direction == "right") {
    swipeRight++;
    if (swipeRight == 5) {
      swipeRight = 0;
    }
  }

  swipePage = swipeLeft - swipeRight;

  if (swipePage == 0) {
    $("html, body").animate({
      scrollLeft: 0,
    }, 1500);
    swipeLeft = 0;
    swipeRight = 0;
  }

  if (swipePage == 1) {
    $("html, body").animate({
      scrollLeft: $("#hwwPage").offset().left
    }, 1500);
  }

  if (swipePage == 2) {
    $("html, body").animate({
      scrollLeft: $("#projPage").offset().left
    }, 1500);
  }

  if (swipePage == 3) {
    $("html, body").animate({
      scrollLeft: $("#digiPage").offset().left
    }, 1500);
  }

  if (swipePage == 4) {
    $("html, body").animate({
      scrollLeft: $("#contPage").offset().left
    }, 1500);
  }

  console.log(swipeRight + "+" + swipeLeft);
  console.log(swipePage);
}

Answer 1

我修复了你的代码：我认为你真的不需要swipeleft和swiperight。只需根据滑动方向增加或减少swipePage值：

var swipePage = 0;

function swipe1(event, direction, distance, duration, fingerCount) {

    if (direction == "left") 
        if (swipePage > 0) 
           swipePage++;

    if (direction == "right") 
        if (swipePage < 4) 
           swipePage--;

    var pageIds = ["",
                   "#hwwPage",
                   "#projPage",
                   "#digiPage",
                   "#contPage"
                  ];
    $("html, body").animate({
       scrollLeft: $(pageIds[swipePage]).offset().left
    }, 1500);
}

jquery - 滑动页面计数

1 个答案: