Nervous Penpal Message

    react-lens-zoom

    0.1.6 • Public • Published

    react-lens-zoom

    The Simplest Zoom Module for Your React Components

    Installation

    npm i react-lens-zoom

    Usage

    import ImageLensZoom from 'react-lens-zoom';
     
    const Example = () => (
      <ImageLensZoom 
        source='https://webkit.org/demos/srcset/image-src.png'
      />
    );

    Props

    Property Type Description Mandatory? Default
    source String The Mandatory Image Source Yes -
    sourceId String Unique Identifier for Source Image element in DOM No sourceImage
    destId String Unique Identifier for Destination Image element in DOM No destImage
    sourceClass String Additional ClassName to Source Image Element No addSourceClass
    destClass String Additional ClassName to Destination Image Element No addDestClass
    sourceWidth String Width of the Source Image No 300
    destWidth String Width of the Destination Image No 700
    sourceHeight String Height of the Source Image No 300
    destHeight String Height of the Destination Image No 500
    destSource String Optional Destination Image with Higher Resolution No null

    Methods

    • onLoad() - Function - Callback once the source Image had been loaded. Signifies the point for zoom calculations.

    Check out the src/Example for Customized Usage

    Install

    npm i react-lens-zoom

    DownloadsWeekly Downloads

    5

    Version

    0.1.6

    License

    MIT

    Unpacked Size

    178 kB

    Total Files

    19

    Last publish

    Collaborators

    • arbaazadossani