请问有没有那种移动端页面上的图片放大缩小的插件推荐？

Question

请问有没有那种移动端页面上的图片放大缩小的插件推荐？ 类似Pinchzoom.js
感觉这个插件的放大缩小效果很卡顿在手机上，大家有没有好的推荐的额？

Answer 1

jQuerh H5移动端图片预览插件fly_zomm_img.js

MPreview.js 移动端图片预览组件，支持手势缩放，双击放大，缩小

Viewer v1.0.0 A simple jQuery image viewing plugin.
Viewer.js – 强大的JS/jQuery图片查看器 支持移动设备触摸事件

一搜一大堆啊

Answer 2

可以自己实现以下，你看有没有用

touchScale(e) {
      e.preventDefault();
      // 记录变化量
      // 第一根手指
      var oldTouch1 = {
        x: this.touches[0].clientX,
        y: this.touches[0].clientY
      };
      var newTouch1 = {
        x: e.touches[0].clientX,
        y: e.touches[0].clientY
      };
      // 第二根手指
      var oldTouch2 = {
        x: this.touches[1].clientX,
        y: this.touches[1].clientY
      };
      var newTouch2 = {
        x: e.touches[1].clientX,
        y: e.touches[1].clientY
      };
      var oldL = Math.sqrt(
        Math.pow(oldTouch1.x - oldTouch2.x, 2) +
          Math.pow(oldTouch1.y - oldTouch2.y, 2)
      );
      var newL = Math.sqrt(
        Math.pow(newTouch1.x - newTouch2.x, 2) +
          Math.pow(newTouch1.y - newTouch2.y, 2)
      );
      var cha = ~~(newL - oldL);
      // 根据图片本身大小 决定每次改变大小的系数, 图片越大系数越小
      // 1px - 0.2
      var coe = 1;
      coe =
        coe / this.trueWidth > coe / this.trueHeight
          ? coe / this.trueHeight
          : coe / this.trueWidth;
      coe = coe > 0.1 ? 0.1 : coe;
      var num = coe * cha;
      if (!this.touchNow) {
        this.touchNow = true;
        if (cha > 0) {
          this.scale += Math.abs(num);
        } else if (cha < 0) {
          this.scale > Math.abs(num)
            ? (this.scale -= Math.abs(num))
            : this.scale;
        }
        this.touches = e.touches;
        setTimeout(() => {
          this.touchNow = false;
        }, 8);
      }
    },

Answer 3

https://github.com/fengyuanch...

Answer 4

react-photoswipe-node

Answer 5

https://photoswipe.com/