0

我已经制作了这个测试页面，用于在站点中使用 fancybox，它在所有 Mac 浏览器、iOS 和 PC 上的非 IE 浏览器上都可以。Windows 8 上的最新 IE 也可以。但是XP上的IE8、7和6不显示透明覆盖或页面上的弹出框阴影，并且弹出下的页面上的链接仍然可以点击（我不想要）。（注意，测试页面上的弹出图像不一定是正确的最终图像 - 没关系）。

可能我在某个地方搞砸了 js（除了能够更改非常基本的配置之外，我在 js 方面的专业知识为零）。我注意到 fancybox 演示页面在较旧的 IE 中运行良好。

我对旧 IE 中的框阴影并不在意，但我需要显示叠加层的模态行为。

任何指向我出错的地方都将不胜感激。

4

1 回答 1

1

好吧，这是修改原始 fancybox 文件不是一个好主意的典型情况（除非您知道自己在做什么。）创建自己的自定义脚本来修改默认设置总是更好。

在您的“修改后的”fancybox js 文件中，您在第 1707 行添加了这个：

css : {
  'background' : 'rgba(200,200,200,0.35)'  // changing here does change overlay colour
},    // custom CSS properties

该更改抑制了要渲染的 fancybox 覆盖图像，如 fancybox css 文件的第 151 行中所设置：

.fancybox-overlay {
    background: url("fancybox_overlay.png") repeat scroll 0 0 transparent;
    /* other properties here */
}

IE8 及更低版本不支持RGBa所以不存在覆盖。不过，按照此处的建议设置后备声明以避免此类问题是一个好主意。

下一次，尝试使用您自己的自定义脚本覆盖默认设置，并保留原始文件。

编辑：

如果您想设置自己的 png叠加图像背景（具有自己的颜色和不透明度），则只需添加到您的自定义脚本中：

helpers: {
    overlay: {
        css: {
            'background-image': 'url("path/my_own_overlay.png")'
        }
    }
}

并留下原始fancybox_overlay.png文件。

于 2013-03-26T18:13:29.460 回答