Question

我正在使用带有禁用缩放的照片，如建议的Cells，但也希望避免在prev / next箭头下方到达非常美丽的图像。有没有一种简单的方法来实现这一目标？

Answer 1

通过

找到解决方案

1）给.pswp__item“填充”，如下所示：

.pswp__item {
    left: 50px;
    right: 50px;
}

2）在调整大小之前更新水平视口大小：

pswp.listen('beforeResize', function(){
    pswp.viewportSize.x = pswp.viewportSize.x - 100;
);

Answer 2

我无法评论@johjoh的答案，因此，如果要使用PhotoSwipe的getThumbBoundsFn ，我将在此处复制它并添加进行此工作所需的第三步。

1）对.pswp__item进行“填充”，如下所示：

.pswp__item { left: 50px; right: 50px; }

2）在调整大小之前更新水平视口大小：

pswp.listen('beforeResize', function(){ pswp.viewportSize.x = pswp.viewportSize.x - 100; );

3）确保getThumbBoundsFn通过从计算值中减去一侧（在本示例中为50px）来正确计算x值：

bounds = { x: {x} - 50, y: ..., w: ..., }

如何在Photoswipe中获得水平填充？

2 个答案: