$(document).ready(function(){ // Set up PhotoSwipe, setting "preventHide: true" var thumbEls = Code.photoSwipe('a', '#Gallery', { preventHide: true }); Code.PhotoSwipe.Current.show(0); });
当然这个插件还有很多其他的监听函数：
document.addEventListener('DOMContentLoaded',function(){ //onBeforeShow 在gallery将要展示之前调用该方法 Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onBeforeShow,function(e){ console.log("onBeforeShow"); })； // onshow 在gallery展示的时候调用 Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onShow,function(e){ console.log("onShow"); }); // onBeforeHide 在gallery隐藏之前 Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onBeforeHide, function(e){ console.log('onBeforeHide'); }); // onHide 在Gallery隐藏的时候 Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onHide, function(e){ console.log('onHide'); }); // onShowNext 在展示下一个的时候 Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onShowNext, function(e){ console.log('onShowNext'); }); // onShowPrevious 在展示上一个的时候 Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onShowPrevious, function(e){ console.log('onShowPrevious'); }); // onDisplayImage 在图片展示 Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onDisplayImage, function(e){ console.log('onDisplayImage'); }); // onResetPosition 当Gallery的大小和位置发生变化时或者设备的方向或者窗口大小改变时，出发该方法 Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onResetPosition, function(e){ console.log('onResetPosition'); }); // onSlideshowStart 当gallery开始滑动展示的时候（此方法可能是我理解有误，实验过程中一直没有触发过 的），原文是：When the gallery has started the slideshow Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onSlideshowStart, function(e){ console.log('onSlideshowStart'); }); // onSlideshowStop 当Gallery活动结束的时候 Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onSlideshowStop, function(e){ console.log('onSlideshowStop'); }); // onBeforeCaptionAndToolbarShow 在顶部状态栏和底部的工具栏展示之前触发 Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onBeforeCaptionAndToolbarShow, function(e){ console.log('onBeforeCaptionAndToolbarShow'); }); // onBeforeCaptionAndToolbarHide 在顶部状态栏和底部的工具栏隐藏之前触发 Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onBeforeCaptionAndToolbarHide, function(e){ console.log('onBeforeCaptionAndToolbarHide'); }); // onViewportClick 在gallery中点击屏幕的时候触发，此时一般会触发onBeforeCaptionAndToolbarShow 或者onBeforeCaptionAndToolbarHide 方法 Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onViewportClick, function(e){ console.log('onViewportClick'); }); },false);