本節(jié)解釋options:
配置項接收鍵值對的形式，并且作為一個參數(shù)添加到PhotoSwipe的構造函數(shù)中杏慰。
var options = {
index: 3,
escKey: false,
// ui option
timeToIdle: 4000
};
var gallery = new PhotoSwipe( someElement, PhotoSwipeUI_Default, someItems, options);
gallery.init();
// Note that options object is cloned during the initialization.
// But you can access it via `gallery.options`.
// For example, to dynamically change `escKey`:
gallery.options.escKey = false;
// `options.escKey = false` will not work
core核心
1、index : (整數(shù)) 從0開始 必須是整數(shù)，不能是字符串
2、getThumbBoundsFn (function類型)
這個函數(shù)會返回一個坐標對象：縮放動畫從哪里開始放大或者從哪里開始縮小甩牺。
這個對象包含三個屬性:x(相對于文檔的X位置),y(相對于文檔的Y位置),w(元素的寬度）。高度將根據(jù)大圖像的大小自動計算累奈。例如如果你返回{ x:0,y:0,w:50 }縮放動畫會從頁面的左上角開始柴灯。
這個函數(shù)有一個參數(shù)，index, 即打開或關閉的項的索引费尽。
在非模態(tài)框的模式下，x和y中應該減去這個模板相對于viewport的位置羊始。
一個計算縮略圖位置的例子：
getThumbBoundsFn: function(index) {
// find thumbnail element
var thumbnail = document.querySelectorAll('.my-gallery-thumbnails')[index];
// get window scroll Y
var pageYScroll = window.pageYOffset || document.documentElement.scrollTop;
// optionally get horizontal scroll
// get position of element relative to viewport
var rect = thumbnail.getBoundingClientRect();
// w = width
return {x:rect.left, y:rect.top + pageYScroll, w:rect.width};
// Good guide on how to get element coordinates:
// http://javascript.info/tutorial/coordinates
}
如果小縮略圖和大圖的尺寸不一致旱幼，可以考慮使用zoom+fade的動畫。
