js 左右滑动切换图片

$('.slider').on('touchend', function (e) {
        // 判断默认行为是否可以被禁用
        if (e.cancelable) {
          // 判断默认行为是否已经被禁用
          if (!e.defaultPrevented) {
            e.preventDefault();
          }
        }
        var moveEndX = e.originalEvent.changedTouches[0].pageX;
        var moveEndY = e.originalEvent.changedTouches[0].pageY;
        if (moveEndX - startX > 0) {
          // 左滑
          if (flagImg.no > 1) {
            $('#img' + flagImg.no).hide()
            flagImg.no -= 1
            $('#img' + flagImg.no).show()
            $('#badge').html(flagImg.no + '/' + flagImg.total)
          }
        } else if (moveEndX - startX < 0) {
          // 右滑
          if (flagImg.no == flagImg.cache && flagImg.no <= flagImg.total) {
            // 请求数据
            reqData.p++
            getImg()
          } else if (flagImg.no <= flagImg.total) {
            $('#img' + flagImg.no).hide()
            flagImg.no += 1
            $('#img' + flagImg.no).show()
            $('#badge').html(flagImg.no + '/' + flagImg.total)
            if (flagImg.no == flagImg.total) {
              mui.toast('已经是最后一页了!')
            }
          }
        } else if ((moveEndX - startX == 0) && (moveEndY - startY == 0) ) {
          // 如果需要使用点击事件,操作写于此处
        }
      });

猜你喜欢

转载自blog.csdn.net/sjpeter/article/details/111686379
今日推荐