search

surmon-china / vue-awesome-swiper

🏆 Swiper component for @vuejs
https://github.surmon.me/vue-awesome-swiper
MIT License
12.81k stars 1.97k forks source link

Lightbox/fancybox example #439

Open songoo opened 5 years ago

songoo commented 5 years ago

Hello, really awesome slider. I target for centered multi-item slider with light box(or fancy box or modal or anything) opened after click on image (like classic gallery), is that possible ?

songoo commented 5 years ago

Hi , I used - https://vuejsexamples.com/simple-lightbox-component-for-vue-applications/ , worked ok. Closing :) 

            showLightBox:  function (imageName) {
                this.$refs.lightbox.show(imageName);
            },
           ...
          <swiper-slide @click.native="showLightBox('imageName.jpg');">...
songoo commented 5 years ago

When 'loop' option is on, cloned slides lose callbacks, so clicking on those won't fire lightBox action which am trying to fire on swiper-slide click.

I tried to move click event on v-on upon image inside but it's also ignored for duplicated slides.

Any way to add callback function on click for 'swiper-slide' duplicated by 'loop' option, but also with passing image name as a parameter so I can open the corresponding image in Light Box?

thanosasimo commented 4 years ago

Did you find any solution on this? I'm trying to do exactly the same.