我怎样才能避免使用 fancybox 3 进行短页转换
How can i avoid a short page shift using fancybox 3
我正在为 joomla 网站上的一些图片库使用 fancybox（版本 3.5.7）。在打开页面、打开 fancybox-modal 和关闭它时，缩略图页面的整个主体都有一个小的移动，它工作得很好。页面移动了很短的时间，然后又回到了原来的位置（参见 http://www.fischer-club.ch/index.php/unser-verein/retro-fotos/1966-training-am-sonntag 上的效果）。
我怎样才能避免这种转变？
我将 fancybox 与另一个名为 masonry 的 jQuery 脚本结合使用。我试图停用砌体脚本，但仍然发生了转变。我也尝试过其他帖子的不同解决方案来解决 fancybox 的移位问题，但它们主要是关于 fancybox 的版本 2，所以没有任何帮助。
这种转变发生在不同的浏览器上，但不会发生在智能手机上。
感谢您的帮助！
默认情况下，脚本通过对 body 元素应用 overflow: hidden; 来隐藏页面滚动条。由于这会导致 body 元素扩展以填充 space，脚本还计算垂直滚动条的宽度并使用该值设置 body 元素的右边距。这非常有效（正如您在主页和所有演示中看到的那样），但这可以通过添加一些额外的 CSS 规则来破坏，例如，通过为 body 元素设置 100% 宽度。
解决方案是删除（通常是不必要的）CSS 破坏默认工作流程的规则，或者通过设置 $.fancybox.defaults.hideScrollbar = false; 来防止隐藏页面滚动条。
编辑：在你的情况下，页面移动是由这个 CSS 规则引起的：
body {
transition: all 400ms ease;
}
例如，您正在为所有内容设置动画，甚至 margin-right 由 fancybox 添加。因此，要么删除那个 CSS 规则，要么将 all 更改为 width 或任何你想要动画的东西。
我正在为 joomla 网站上的一些图片库使用 fancybox（版本 3.5.7）。在打开页面、打开 fancybox-modal 和关闭它时，缩略图页面的整个主体都有一个小的移动，它工作得很好。页面移动了很短的时间，然后又回到了原来的位置（参见 http://www.fischer-club.ch/index.php/unser-verein/retro-fotos/1966-training-am-sonntag 上的效果）。 我怎样才能避免这种转变？
我将 fancybox 与另一个名为 masonry 的 jQuery 脚本结合使用。我试图停用砌体脚本，但仍然发生了转变。我也尝试过其他帖子的不同解决方案来解决 fancybox 的移位问题，但它们主要是关于 fancybox 的版本 2，所以没有任何帮助。 这种转变发生在不同的浏览器上，但不会发生在智能手机上。 感谢您的帮助！
默认情况下，脚本通过对 body 元素应用 overflow: hidden; 来隐藏页面滚动条。由于这会导致 body 元素扩展以填充 space，脚本还计算垂直滚动条的宽度并使用该值设置 body 元素的右边距。这非常有效（正如您在主页和所有演示中看到的那样），但这可以通过添加一些额外的 CSS 规则来破坏，例如，通过为 body 元素设置 100% 宽度。
解决方案是删除（通常是不必要的）CSS 破坏默认工作流程的规则，或者通过设置 $.fancybox.defaults.hideScrollbar = false; 来防止隐藏页面滚动条。
编辑：在你的情况下，页面移动是由这个 CSS 规则引起的：
body {
transition: all 400ms ease;
}
例如，您正在为所有内容设置动画，甚至 margin-right 由 fancybox 添加。因此，要么删除那个 CSS 规则，要么将 all 更改为 width 或任何你想要动画的东西。