Merge pull request #3 from laurenashpole/fix/ipad_main_image

Fix for image disappearing on zoom out on touch devices

demo/src/App.vue

@@ -12,8 +12,8 @@
     <div>
       <h2>Drag Example</h2>
       <inner-image-zoom
-        src="/assets/unsplash.jpg"
-        zoomSrc="/assets/unsplash-large.jpg"
+        src="/assets/unsplash2.jpg"
+        zoomSrc="/assets/unsplash2-large.jpg"
         moveType="drag"
         :fullscreenOnMobile="true"
       />

src/InnerImageZoom/InnerImageZoom.vue

@@ -83,6 +83,7 @@
 
             <button
               v-if="this.isTouch"
+              type="button"
               class="iiz__btn iiz__close"
               aria-label="Zoom Out"
               v-bind:class="{ 'iiz__close--visible': isZoomed }"
@@ -91,7 +92,7 @@
                   this.isFullscreen ? 0 : fadeDuration
                 }ms visibility`
               }"
-              v-on:click="handleClose"
+              v-on:click.stop="handleClose"
             />
           </div>
         </MountingPortal>
@@ -122,14 +123,15 @@
         <button
           v-if="this.isTouch"
           class="iiz__btn iiz__close"
+          type="button"
           aria-label="Zoom Out"
           v-bind:class="{ 'iiz__close--visible': isZoomed }"
           v-bind:style="{
             transition: `linear ${this.isFullscreen ? 0 : fadeDuration}ms opacity, linear ${
               this.isFullscreen ? 0 : fadeDuration
             }ms visibility`
           }"
-          v-on:click="handleClose"
+          v-on:click.stop="handleClose"
         />
       </template>
     </template>

tests/unit/index.spec.js

@@ -26,7 +26,7 @@ describe('InnerImageZoom', () => {
         left: 0,
         bottom: 0,
         right: 0
-      }
+      };
     });
   });