mirror of
https://github.com/gosticks/DefinitelyTyped.git
synced 2025-10-16 12:05:41 +00:00
50 lines
1.6 KiB
TypeScript
50 lines
1.6 KiB
TypeScript
import * as React from 'react';
|
|
|
|
import ReactImageMagnify from 'react-image-magnify';
|
|
|
|
class TestImageMagnify extends React.Component {
|
|
render() {
|
|
return (
|
|
<ReactImageMagnify
|
|
smallImage={{
|
|
alt: 'Wristwatch by Ted Baker London',
|
|
isFluidWidth: true,
|
|
src:
|
|
'https://ethanselzer.github.io/react-image-magnify/static/media/wristwatch_687.8ea75ffc.jpg',
|
|
}}
|
|
largeImage={{
|
|
src:
|
|
'https://ethanselzer.github.io/react-image-magnify/static/media/wristwatch_687.8ea75ffc.jpg',
|
|
width: 1200,
|
|
height: 1800,
|
|
}}
|
|
></ReactImageMagnify>
|
|
);
|
|
}
|
|
}
|
|
|
|
const App: React.FC = () => {
|
|
return (
|
|
<div>
|
|
<ReactImageMagnify
|
|
enlargedImageContainerDimensions={{ width: '100%', height: '100%' }}
|
|
smallImage={{
|
|
alt: 'Testing',
|
|
isFluidWidth: false,
|
|
width: 300,
|
|
height: 400,
|
|
src: "https://ethanselzer.github.io/react-image-magnify/static/media/wristwatch_687.8ea75ffc.jpg"
|
|
}}
|
|
largeImage={{
|
|
width: 1200,
|
|
height: 1200,
|
|
src: "https://ethanselzer.github.io/react-image-magnify/static/media/wristwatch_1200.c9182206.jpg"
|
|
}}
|
|
>
|
|
</ReactImageMagnify>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default App;
|