图片灯箱动画优化

- 为图片灯箱加入了从哪来回哪去的动画
2026-08-27 15:47:16 +08:00
parent 6e1035d76f
commit 2c6319e62a
2 changed files with 19 additions and 2 deletions
@@ -24,13 +24,19 @@
    const items = images.map((item) => ({
      ...getSize(item),
      src: item.dataset.originalSrc || item.currentSrc || item.src,
-      alt: item.alt
+      msrc: item.currentSrc || item.src,
+      alt: item.alt,
+      element: item
    }));

    lightboxPromise ??= import('photoswipe/lightbox').then(({ default: PhotoSwipeLightbox }) => {
      const lightbox = new PhotoSwipeLightbox({
        pswpModule: () => import('photoswipe'),
-        bgClickAction: 'close'
+        bgClickAction: 'close',
+        showHideAnimationType: 'zoom',
+        showAnimationDuration: 360,
+        hideAnimationDuration: 300,
+        easing: 'cubic-bezier(0.22, 1, 0.36, 1)'
      });
      lightbox.init();
      return lightbox;