search

ts1 / flipbook-vue

3D page flip effect for Vue.js
https://ts1.github.io/flipbook-vue/
620 stars 159 forks source link

Question: How to implement zoom on double click? #52

Open Marchiuzzz opened 3 years ago

Marchiuzzz commented 3 years ago

I know I can use the flipbook's zoomIn() method but I've tried attaching a @dblclick event directly on flipbook component but it seems that it does not fire it for some reason, am I missing something?

<flipbook
        ref="container"
        @dblclick="zoomFlipbook"
        :startPage="page"
        :pages="images" 
        :zooms="zooms"
        @zoom-start="setZoom" 
        @flip-left-start="nextPage" 
        @flip-right-start="nextPage"
        @flip-left-end="updateImagePositions"
        @flip-right-end="updateImagePositions">
        </flipbook>

in methods I have

zoomFlipbook(){
      this.$refs.container.zoomIn();
}
ts1 commented 3 years ago

Sorry for the delay in replying. You can set up a native dblclick handler by writing like the following:

        @dblclick.native="zoomFlipbook"