Neptune's Potato Monsters

    vue-product-zoomer

    3.0.1 • Public • Published

    Welcome to Vue Product Zoomer 👋

    Version npm GitHub issues GitHub license Documentation Maintenance Twitter: akulubala

    A Image Zoomer For Eshop Website.Saving Your Time...

    🏠 Homepage

    Install

    npm install vue-product-zoomer

    Usage

    import ProductZoomer from 'vue-product-zoomer'
    Vue.use(ProductZoomer)
     
    <ProductZoomer
      :base-images="images"
      :base-zoomer-options="zoomerOptions"
    />
     

    Options

    images

    {
        {
          'thumbs':    // optional, if not present will use normal_size instead
          [
            {'id':'unique id''url''image url'},
            {'id':'unique id''url''image url'}
          ]
        },
        {
          'normal_size':  // required
          [
            {'id':'unique id''url''image url'},
            {'id':'unique id''url''image url'}
          ]
        },
        {
          'large_size':    //optional, if not present will use normal_size instead
          [
            {'id':'unique id''url''image url'},
            {'id':'unique id''url''image url'}
          ]
        }
     }

    zoomerOptions

    {
        zoomFactor: 3, // scale for zoomer
        pane: 'pane', // three type of pane ['pane''container-round''container']
        hoverDelay: 300, // how long after the zoomer take effect
        namespace: 'zoomer', // add a namespace for zoomer component, useful when on page have mutiple zoomer
        move_by_click:false // move image by click thumb image or by mouseover
        scroll_items: 5, // thumbs for scroll
        choosed_thumb_border_color: "#bbdefb", // choosed thumb border color
        scroller_button_style: "line",
        scroller_position: "left",
        zoomer_pane_position: "right"
    }

    Author

    👤 Raymond Cheng

    🤝 Contributing

    Contributions, issues and feature requests are welcome!

    Feel free to check issues page.

    Show your support

    Give a ⭐️ if this project helped you!


    This README was generated with ❤️ by readme-md-generator

    Keywords

    none

    Install

    npm i vue-product-zoomer

    DownloadsWeekly Downloads

    350

    Version

    3.0.1

    License

    none

    Unpacked Size

    5.37 MB

    Total Files

    97

    Last publish

    Collaborators

    • akulubala