!npm

vue-gallery-slideshow

Lightweight and responsive image gallery for Vue.js.


Live Demo

https://jsfiddle.net/headione/szk73x45/show/

Installation

#### By CDN

``html

`

#### By package manager

`bash
npm install vue-gallery-slideshow
`

`bash
yarn add vue-gallery-slideshow
`

Usage

#### HTML

`html



`

#### JavaScript

`javascript
import VueGallerySlideshow from 'vue-gallery-slideshow';

const app = new Vue({
el: '#app',
components: {
VueGallerySlideshow
},
data: {
images: [
'https://placekitten.com/801/800',
'https://placekitten.com/802/800',
'https://placekitten.com/803/800',
'https://placekitten.com/804/800',
'https://placekitten.com/805/800',
'https://placekitten.com/806/800',
'https://placekitten.com/807/800',
'https://placekitten.com/808/800',
'https://placekitten.com/809/800',
'https://placekitten.com/810/800'
],
index: null
}
});
`

$3

Adding alt text

If you want to add alt tags to the images, you can do by wrapping it in an object and adding an alt property:

`javascript
images: [
{ url: 'https://placem.at/places?w=800&h=600&random=1', alt:'My alt text' },
...
]
`

Usage with Nuxt.js

When used with server-side rendering frameworks like Nuxt.js, please wrap the component in a element like shown below:

`html
...




...
``

Contributing

Please refer to each project's style guidelines and guidelines for submitting patches and additions. In general, we follow the "fork-and-pull" Git workflow.

1. Fork the repo on GitHub
2. Clone the project to your machine
3. Commit changes to your branch
4. Push your work back up to your fork
5. Submit a Pull request so that we can review your changes

NOTE: Be sure to merge the latest from "upstream" before making a pull request!

Author

Norman Sander

License

vue-gallery-slideshow is available under the MIT license. See the LICENSE file for more info.