Notorious Public Menace

    pinch-zoom-pan
    TypeScript icon, indicating that this package has built-in type declarations

    3.0.0 • Public • Published

    pinch-zoom-pan

    A simple module that add pinch-zoom and pan to your HTML element.

    Using

    npm i -S pinch-zoom-pan
    <div class="root" id="root">
      <div class="point">
        <div class="canvas">
          <!-- your content here -->
        </div>
      </div>
    </div>
    .root {
      position: relative;
      transform: translateZ(0);
      overflow: hidden;
    }
     
    .point {
      position: absolute;
      width: 0;
      height: 0;
      transform: translate(00) scale(1);
      transform-origin: center;
      will-change: transform;
    }
     
    .canvas {
      position: absolute;
      transform: translate(-50%-50%);
    }
    import { create } from 'pinch-zoom-pan';
    create({ element: document.getElementById('root') });

    Frameworks & libraries

    Install

    npm i pinch-zoom-pan

    DownloadsWeekly Downloads

    59

    Version

    3.0.0

    License

    MIT

    Unpacked Size

    16.1 kB

    Total Files

    12

    Last publish

    Collaborators

    • sanich