From a02e8a0a1bbd434518aa9c51268ac8e553c5b875 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=BB=93=E5=8F=91=E5=8F=97=E9=95=BF=E7=94=9F?=
 <init_pro@aliyun.com>
Date: Sun, 12 May 2019 00:01:31 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9PhotoSwipe=E7=9A=84=E5=8F=82?=
 =?UTF-8?q?=E6=95=B0=E9=94=99=E8=AF=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 themes/yilia/source-src/css/grid.scss |  2 +-
 themes/yilia/source-src/js/viewer.js  | 16 ++++++++++++----
 2 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/themes/yilia/source-src/css/grid.scss b/themes/yilia/source-src/css/grid.scss
index 54dd04c..7b84995 100644
--- a/themes/yilia/source-src/css/grid.scss
+++ b/themes/yilia/source-src/css/grid.scss
@@ -38,7 +38,7 @@ html, body, #container {
 	position:absolute;
 	right:0;
 	min-height:100%;
-	background:#f5dfc6;
+	background:#e3d8cc;
 	left: 300px;
 	width: auto;
 	@extend %trans;
diff --git a/themes/yilia/source-src/js/viewer.js b/themes/yilia/source-src/js/viewer.js
index d3bd486..ad51d76 100644
--- a/themes/yilia/source-src/js/viewer.js
+++ b/themes/yilia/source-src/js/viewer.js
@@ -7,7 +7,13 @@ import Util from './util'
 
 function init() {
 	let pswpElement = document.querySelectorAll('.pswp')[0]
-	let $imgArr = document.querySelectorAll(('.article-entry img:not(.reward-img)'))
+  let $imgArr = document.querySelectorAll('.article-entry img:not(.reward-img)')
+  let getThumbBoundsFn = function(index) {
+    var thumbnail = document.querySelectorAll('.article-entry img:not(.reward-img)')[index]
+    var pageYScroll = window.pageYOffset || document.documentElement.scrollTop
+    var rect = thumbnail.getBoundingClientRect()
+    return {x:rect.left, y:rect.top + pageYScroll, w:rect.width}
+  }
 	Array.prototype.forEach.call($imgArr, ($em, i) => {
 		$em.addEventListener('click', function(){
 			// slider展开状态
@@ -20,15 +26,17 @@ function init() {
 				const image = new Image()
 				image.src = src
 				items.push({
-					src: src,
+          msrc: src, // 缩略图的地址(在动画过程中显示的是缩略图, 这里暂且用相同的地址了)
+					src,
 					w: image.width || $em2.width,
 					h: image.height || $em2.height,
-					title: title
+					title
 				})
 			})
 			var gallery = new PhotoSwipe(pswpElement, PhotoSwipeUI_Default, items, {
 				index: parseInt(i),
-				bgOpacity: 0.8
+        bgOpacity: 0.8,
+        getThumbBoundsFn
 			})
 			gallery.init()
 		})