Disable zooming in for photo swipe
I'm using Photo Swipe to display my images. The default behavior when using it is that once the images are clicked, I'll be able to 开发者_高级运维bring me to a "zoom-in page" where the photos are enlarged and i can view them one by one by swiping.
I'm trying to overwrite this behavior because I want to do something else after the user clicks on the image.
All solutions described here did not work for me. Here is a complete solution that turns off zooming.
Settings:
var options = {
// Gallery options
maxSpreadZoom: 1,
getDoubleTapZoom: function (isMouseClick, item) {
return item.initialZoomLevel;
},
// UI options
zoomEl: false
};
Gallery init:
var gallery = new PhotoSwipe(pswpElement, PhotoSwipeUI_Default, items, options);
// ...
And finally add this CSS snippet to disable zoom cursor:
.pswp--zoom-allowed .pswp__img {
cursor: default !important
}
The option allowUserZoom doesn't exist in the documentation
You can disable the double tap zoom by returning item.initialZoomLevel and reduce the spread (zoom) gesture by setting maxSpreadZoom to the same initialZoom :
gallery.init();
gallery.options.maxSpreadZoom = gallery.getZoomLevel();
gallery.options.getDoubleTapZoom = function(isMouseClick, item) {
return item.initialZoomLevel;
}
to disable zooming you must set
allowUserZoom = false
In 2023 version the answer is for example:
imageClickAction: 'next' / 'close',
加载中,请稍侯......
精彩评论