Expand Images To Full Size – vue-expandable-image

Description:

expandable-image is a basic image lightbox component that expands the image to the fullsize on click/tap.

How to use it:

Install and import the vue-expandable-image component into your project.

import VueExpandableImage from 'vue-expandable-image'

Use the component.

<expandable-image 
  class="image" 
  src="1.jpg" 
  alt="dog" 
  title="dog">
</expandable-image>

Enable the component.

new Vue({
  el: '#app',
  mounted() {
    const viewportMeta = document.createElement('meta');
    viewportMeta.name = 'viewport';
    viewportMeta.content = 'width=device-width, initial-scale=1';
    document.head.appendChild(viewportMeta);
  } });

Preview:

 

Download Details:

Author: TahaSh

Live Demo: https://codepen.io/tahazsh/pen/aMbooL

Download Link: https://github.com/TahaSh/vue-expandable-image/archive/master.zip

Official Website: https://github.com/TahaSh/vue-expandable-image

Last Update: September 16, 2019

Install:

# NPM
$ npm install vue-expandable-image --save

You Might Be Interested In:

Tags:

Add Comment