1.3.1 • Published 9 years ago

react-magic-zoom v1.3.1

Weekly downloads
7
License
MIT
Repository
github
Last release
9 years ago

This component don’t have a third part dependency. Work correct for touch devices.

Here you can see DEMO

####Usage:

For use this component you should put inside it node with <img> tab with fill src:

require("!style!css!sass!../src/scss/_react-magic-zoom.scss");

import React from ‘react’;
import ReactDOM from ‘react-com’;
import ReactMagicZoom from ‘react-magic-zoom’;

export class App extends React.Component {
    render() {
        return (
            <MagicZoom>
                <span>
                    <img src={'http://lorempixel.com/520/400/sports/1'} />
                </span>
            </MagicZoom>
	);
    }
}

ReactDOM.render(<App/>, document.getElementById('app'));

####Option:

// Type 'auto' - autosize cursor and reflection,
// 'donor' - not render
type: 'auto',

// Method for add subscriber
subscribeOnReflection= function(reflection){}

reflection: {
    // Value:   'left', 'right', 'top', 'bottom' - position of
    //                                              reflection
    //          Object {left: '10px', top: '10%'}
    //
    position: 'left',

    // Value: @flaot - scale coefficient
    scale: 2,

    // reflection size in pixel, as default will be setter size of pictures
    size: {
        height: 100,
        width: 300
    }
}
1.3.1

9 years ago

1.3.0

9 years ago

1.2.0

9 years ago

1.1.2

10 years ago

1.1.1

10 years ago

1.1.0

10 years ago

1.0.4

10 years ago

1.0.3

10 years ago

1.0.2

10 years ago

1.0.1

10 years ago

1.0.0

10 years ago