vue H5 双指放大

插件Easyscroller

githup：https://github.com/ulesta/easyscroller

npm

npm i easyscroller --save

yarn

yarn add easyscroller --save

使用

 <div id="container">
    <div id="scroll-content">
      <img src="../common/image/guide.jpg" alt="" />
    </div>
  </div>

<style  scoped>
  #container {
   height: 99vh;
   overflow: hidden;
   width: 100%;
   position: relative;
}
</style>

import { EasyScroller } from "easyscroller";
export default {
  data() {
    return {
      scroller: "",
    };
  },
  mounted() {
    const element = document.querySelector("#scroll-content");
    this.scroller = new EasyScroller(element, {
      scrollingX: true,
      scrollingY: true,
      zooming: true,
      minZoom: 1,
      maxZoom: 3.0,
      zoomLevel: 1,
      bouncing: false,
    });
  },
  beforeDestroy() {
    this.scroller.destroy();
  },
};