vue3-image-box

A simple image lightbox component for vue3.0
1,820
vue vue3 image picture picturebox picture-box imagebox image-box image-lightbox
Install
npm install vue3-image-box
Latest Version:1.1.0
Vue:3
License:MIT
Last Updated:Mar 29, 2021
Links: GitHub  ·  npm
Maintainer: k80092

vue3-image-box

SampleGif

A simple image lightbox component for vue3.0!!

I use CSS style from vue-image-lightbox

DEMO

Online Demo

SampleCode

import

import ImageBox from "vue3-image-box";

component

<image-box
  image-list-class="yourclass"
  :images="images"
></image-box>

sample data

setup() {
    const images=[
        {
            thumb: "http://example.com/thumb.jpeg",
            src: "http://example.com/image.jpeg",
            caption: "my image1!",
        },
        {
            thumb: "http://example.com/thumb2.jpeg",
            src: "http://example.com/image3.jpeg",
            caption: "my image2!",
        },
        ...
    ];

    return {
        images
    }
}

Related Packages

vue-image-annotation

add annotation to the picture

3,696 32
image picture vue annotation draw edit
vue-picture-input

Mobile-friendly picture file input component with image preview and drag and dro...

131,226 883
image picture vue form input preview upload
vue-testm-ui
1,215
image picture vue vue3 photo preview viewer vite
vue-img-viewr

vue图片查看组件（vue image viewer component），with vue@3.x

3,419 6
image picture vue vue3 image viewer picture preview picture viewer preview viewer vue-img-viewr
@vue-image-modernizer/vue-cli-plugin-image-modernizer

A Vue plugin to make your images responsive

2,759 3
image picture vue compress img plugin responsive source srcset vue-cli

Version History

Version Released Vue License
1.1.0 ^3.0.0 MIT
1.0.0 ^3.0.0 MIT