Package Exports

react-medium-image-zoom

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-medium-image-zoom) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-medium-image-zoom

Installation

$ npm install --save react-medium-image-zoom

Usage

import ImageZoom from 'react-medium-image-zoom'

const MyComponent = (props) =>
  <div>
    <p>Some text...</p>

    <ImageZoom
      image={{
        src: 'bridge.jpg',
        alt: 'Golden Gate Bridge',
        className: 'img',
        style: {}
      }}
      zoomImage={{
        src: 'bridge-big.jpg',
        alt: 'Golden Gate Bridge',
        className: 'img--zoomed',
        style: {}
      }}
    />

    <p>Some text...</p>
  </div>

The component accepts three props:

image [ object | required ]: the original image
zoomImage [ object | optional ]: the image to be used for zooming
replaceImage [ boolean | optional | default true ]: once the image has been "zoomed" and downloaded the larger image, replace the original image. This is set to true by default.

Each one of these image props accepts four props:

src [ string | required ]: the source for the image
alt [ string | optional ]: the alt text for the image
className [ string | optional ]: classes to apply to the image
style [ object | optional ]: additional styles to apply to the image

Contribute

Check out the issues
Fork this repository
Clone your fork
Check out a feature branch ($ git checkout -b my-feature)
Make your changes and push your branch to your GitHub repo
Create a pull request from your branch to this repo's master branch
When all is merged, pull down the upstream changes to your master
Delete your feature branch