在 Chrome 和 Safari 中导致 DIV 覆盖在页面上的 Magnific Popup

Question

我正在使用 Magnific Popup 在 Joomla! 中显示照片画廊！（K2 的 SIG Pro 插件的一部分）。除 Google Chrome 和 Apple Safari 外，所有浏览器都运行良好。单击图像打开并关闭弹出窗口后，页面上会留下一个不可见的 DIV，因此将鼠标悬停在页面内容上会导致出现第二个滚动条（在这个隐藏的 DIV 中？） .

以下是存在此问题的网页示例： http://surfaceartinc.com/designer-glass-and-metals/itemlist/category/417-translucent-fresco-glass.html

按照以下步骤重现问题：

打开 Google Chrome（或 Apple Safari）
访问上面的页面（或网站上的类似产品页面）
单击页面底部的小色样图像
退出那个image/popup
将鼠标悬停在该页面底部的任何小色样图像上，观察滚动条出现时页面的移动

我看过其他几个没有这个问题的弹出脚本演示（包括 SIG Pro 演示）：

这个问题似乎是我建立的网站特有的。谁能看出这场冲突的根源在哪里？

Answer 1

本例中的问题是 Magnific Popup CSS 中的光标设置。我将 magnific-popup.css 的第 60-63 行修改如下：

发件人：

.mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
  cursor: -moz-zoom-out;
  cursor: -webkit-zoom-out;
  cursor: zoom-out; }

收件人：

.mfp-zoom-out-cur .mfp-image-holder .mfp-close {
  cursor: -moz-zoom-out;
  cursor: -webkit-zoom-out;
  cursor: zoom-out; }

.mfp-zoom-out-cur {
  cursor: -moz-zoom-out; }

当弹出窗口在除 Firefox 之外的所有浏览器中打开时，这消除了将鼠标悬停在灰色叠加层上时的缩小光标。我不知道为什么游标是个问题，但 "shifting" 效果对登录器来说不是问题。

在 Chrome 和 Safari 中导致 DIV 覆盖在页面上的 Magnific Popup

Magnific Popup causing DIV overlay on page in Chrome & Safari

jquery

google-chrome

safari

joomla3.0

magnific-popup