相册展示PhotoSwipe.js插件实现
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);