avs-image-viewer

🛍️ Flipkart-Style Image Viewer in Vue

A highly responsive and interactive product image zoom gallery inspired by Flipkart, built using Vue.js. This component is ideal for eCommerce websites, product previews, and high-resolution image browsing. Includes image zoom on hover, slider thumbnails, and full-screen modal viewing.

---

✨ Features

• 🔍 Magnifier Zoom on Hover (desktop only)
• 🎠 Horizontal Thumbnail Slider
• 🖼️ Full-Screen Modal Preview
• 📱 Mobile Responsive Design
• ⚡ Lightweight and Reusable Vue Component
• 💡 Ideal for Shopify-style product pages and online stores

---

📦 Installation

Clone the repository or copy the component file into your Vue project:

git clone https://github.com/yourusername/vue-flipkart-image-viewer.git

🚀 Usage

app.js

import { createApp } from 'vue';
import App from './App.vue';
import AvsImageViewer from 'avs-image-viewer';

const app = createApp(App);
app.use(AvsImageViewer);
app.mount('#app');

<template>
  <AvsImageViewer :items="imageList" />
</template>

<script>

export default {

  data() {
    return {
      imageList: [
        'https://example.com/image1.jpg',
        'https://example.com/image2.jpg',
        'https://example.com/image3.jpg',
      ],
    };
  },
};
</script>