Fancybox 打开时不适合图像

Question

当我尝试打开图像时，它不适合缩放。我什至尝试使用官方网站上提供的示例。它不适用于本地页面，但适用于 jsfiddle 和类似网站（具有相同的 html/css）。

这里有一个 example 代码和它在本地服务器上如何工作的一些动画（使用 ZF3 骨架应用程序）。图像网格只有 bootstrap 4（它的工作方式与 w/o bootstrap 相同）样式，如官方网站所示：

.image_grid {
  padding-left: 15px;
  padding-right: 15px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  max-width: 100%;
  margin-right: auto;
  margin-left: auto;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  a {
    padding: 5px;
    -webkit-box-flex: 1;
    -webkit-flex: 1 0 33.33%;
    -ms-flex: 1 0 33.33%;
    flex: 1 0 33.33%;
    img {
      width: 100%;
      max-height: auto;
    }
  }
}

Answer 1

升级jQuery到最新版本，至少v3.2.0

Fancybox 打开时不适合图像

Fancybox doesn't fit image when open

javascript

fancybox

fancybox-3