@airhang/vue-book-reader 1.0.1 → 1.0.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@airhang/vue-book-reader",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "A Vue.js book reader component with multiple flip modes, catalog, and page jump features",
   "main": "dist/vue-book-reader.common.js",
   "module": "dist/vue-book-reader.umd.js",
@@ -24,6 +24,7 @@
     "vue": "^2.6.0"
   },
   "dependencies": {
+    "@airhang/vue-book-reader": "^1.0.1",
     "flipbook-vue": "^1.0.0-beta.4"
   },
   "devDependencies": {

package/src/components/BookReader.vue

@@ -6,7 +6,6 @@
     @touchend="onContainerTouchEnd"
     @dblclick="onContainerDoubleClick"
     @click="onContentClick"
-    :style="{ transform: `scale(${zoomScale}) translate(${translateX}px, ${translateY}px)` }"
   >
     <div class="album-header" v-if="false">
       <h1>氪氪</h1>
@@ -16,6 +15,7 @@
     <div
       v-if="contentReady"
       class="flipbook-wrapper"
+      :style="{ transform: `scale(${zoomScale}) translate(${translateX}px, ${translateY}px)` }"
       @dblclick="onFlipbookDoubleClick"
       @touchstart.capture="onFlipbookTouchStart"
       @touchend.capture="onFlipbookTouchEnd"
@@ -240,7 +240,7 @@
     </div>
 
     <!-- PC端缩放工具栏 -->
-    <div v-if="!isMobile" class="zoom-toolbar">
+    <div class="zoom-toolbar">
       <button @click="zoomOut" class="btn-zoom" :disabled="zoomScale <= 0.5">-</button>
       <button @click="zoomIn" class="btn-zoom" :disabled="zoomScale >= 3">+</button>
     </div>
@@ -2212,6 +2212,10 @@ export default {
 
 /* 移动端按钮优化 */
 @media (max-width: 768px) {
+  .zoom-toolbar {
+    display: none;
+  }
+
   .btn:active {
     background: #555;
     transform: none;