Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/micahstubbs/material-photo-gallery
a vanilla JavaScript material design photo gallery plugin
https://github.com/micahstubbs/material-photo-gallery
Last synced: about 1 month ago
JSON representation
a vanilla JavaScript material design photo gallery plugin
- Host: GitHub
- URL: https://github.com/micahstubbs/material-photo-gallery
- Owner: micahstubbs
- Created: 2018-10-02T20:25:56.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2022-12-03T21:07:55.000Z (almost 2 years ago)
- Last Synced: 2023-03-26T16:27:01.805Z (over 1 year ago)
- Language: JavaScript
- Homepage: https://micahstubbs.github.io/material-photo-gallery/example
- Size: 354 KB
- Stars: 12
- Watchers: 4
- Forks: 2
- Open Issues: 10
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Material Photo Gallery
a vanilla JavaScript [material design](https://material.io/design/) photo gallery plugin built with design inspiration from [Google Photos](https://photos.google.com/)
[](//micahstubbs.github.io/material-photo-gallery/example)
interact with the live example at https://micahstubbs.github.io/material-photo-gallery/example
## Install
#### Usage
```js
var MaterialPhotoGallery = require('material-photo-gallery')
var elem = document.querySelector('.m-p-g')
var gallery = new MaterialPhotoGallery(elem)
```
#### Include Script
```html
```
#### Include Stylesheet
```html
```
#### HTML
```html
```
Specify the path to the full size images with the `data-full` attribute on the thumbnail images.
#### Initialize Plugin
```js
// Select gallery element.
var elem = document.querySelector('.m-p-g')
// Init gallery
var gallery = new Gallery(elem)
```
## Browser Support
- Latest Edge
- Latest Chrome
- Latest Firefox
- Latest Safari
## Credits
This project uses [imagesLoaded by David DeSandro](https://github.com/desandro/imagesloaded), and [Google Image Layout by ptgamr](https://github.com/ptgamr/google-image-layout).
This project is a fork of https://github.com/TrueValentine/material-photo-gallery that modernises the codebase and adds new features, like swipe gestures on mobile to navigate the gallery from the detail view.
See also the [Bricks](https://github.com/ArjanJ/bricks) image layout library from [ArjanJ](https://github.com/ArjanJ)
## License
MIT license