1.0.26 • Published 6 years ago
react-bigpicture v1.0.26
react-bigpicture
React Lightbox Component based on BigPicture.js / Video and Image Demo - CodeSandbox
npm install react-bigpicture --save
OR
yarn add react-bigpicture
Props
<BigPicture
src={'http://lorempixel.com/800/600/sports/1'}
caption="Sport picture"
type="image" // "video", "youtube", "vimeo", "iframe", "audio"
noLoader
>
<img src="http://lorempixel.com/400/200/sports/1" />
</BigPicture>
Use Callbacks
<BigPicture
src={'http://lorempixel.com/800/600/sports/1'}
caption="Sport picture"
type="image" // "video", "youtube", "vimeo", "iframe", "audio"
noLoader
animationStart={callbackFn}
animationEnd={callbackFn}
onClose={callbackFn}
onError={callbackFn}
onChangeImage={callbackFn}
>
<img src="http://lorempixel.com/400/200/sports/1" />
</BigPicture>
Example
import React from 'react';
import { render } from 'react-dom';
import BigPicture from "react-bigpicture";
render(
<div>
<BigPicture
type="image"
caption="Example of an optional caption."
src="http://lorempixel.com/1200/700/sports/1"
>
<img src="http://lorempixel.com/400/200/sports/1" />
</BigPicture>
<BigPicture
type="video"
src="http://www.html5videoplayer.net/videos/toystory.mp4"
>
<img src="http://lorempixel.com/400/200/sports/2" />
</BigPicture>
<BigPicture
type="youtube"
src="https://www.youtube.com/watch?v=TTAU7lLDZYU"
>
<img src="http://lorempixel.com/400/200/sports/3" />
</BigPicture>
<BigPicture type="vimeo" src="https://vimeo.com/119287310">
<img src="http://lorempixel.com/400/200/sports/5" />
</BigPicture>
</div>,
document.querySelector('#root')
);
BigPicture by @henrygd https://github.com/henrygd/bigpicture
1.0.26
6 years ago
1.0.25
6 years ago
1.0.24
6 years ago
1.0.23
6 years ago
1.0.22
6 years ago
1.0.21
6 years ago
1.0.20
6 years ago
1.0.19
6 years ago
1.0.18
7 years ago
1.0.17
7 years ago
1.0.16
7 years ago
1.0.15
7 years ago
1.0.14
7 years ago
1.0.13
7 years ago
1.0.12
7 years ago
1.0.11
7 years ago
1.0.10
7 years ago
1.0.9
7 years ago
1.0.8
7 years ago
1.0.7
7 years ago
1.0.6
7 years ago
1.0.5
8 years ago
1.0.4
8 years ago
1.0.3
8 years ago
1.0.2
8 years ago
1.0.1
8 years ago
1.0.0
8 years ago