我已经费尽心思（并且超时）努力找出为什么Colorbox在以下页面上无法正常工作：[链接已移除] 我在右下角设置了一个名为“Web Design By All Web Cafe”的Colorbox测试链接，应该会打开一个小的logo图像。 在Firefox、Safari等浏览器中，模态框按照预期的方式工作，居中显示在所有现有页面内容的上方。在IE中，模态框不仅没有居中，而且似乎没有遵循绝对定位，并将所有现有的页面内容向下推。更糟糕的是，它不会以正确的大小打开，并在模态框图像旁边创建滚动条，这使得模态框变得非常丑陋。我可以通过调整模态框的最小高度来解决滚动条问题，但我想不出为什么它无法居中。让我说一句，我并没有编写这个网站，它是几年前完成的，因此可能有许多CSS hack来使事物正确显示，其中任何一个都可能导致此问题。相比之下，在该网站上还设置了Thickbox（如果您单击深蓝色区域中的“播放视频”），并且表现正确，但存在某些奇怪的大小/填充问题，因此希望用更现代和可扩展的东西来替换它。我可以确认同时拥有这两个模态框脚本/CSS文件没有冲突，因为即使完全删除Thickbox，Colorbox仍然存在问题。非常感谢您的任何想法或建议。
2个回答
16
GOT IT!!! .. 经过对我的代码进行大量修改（遇到了同样的问题）之后，我终于解决了它...
只需添加：
只需添加：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
需要放置在页面的最开始，要在包含文件或其他任何内容之前。
希望能对您有所帮助。 谢谢！
Mariano。
- Nano
3
我欠你一杯啤酒，朋友。非常感谢你的回复。我从来没想到这是一个文档类型问题。结果证明，只要正确声明，实际上也可以使用HTML 4文档类型。我正在使用这个：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> - Andrew
如果你正在使用母版页，那么你只需要将它放在顶部吗？ - B Woods
4这并不太好，因为与HTML5一起使用会更好。 - Junior Mayhé
2
非常好的发现，我的朋友。我正在和几个开发人员一起开发网站项目，也遇到了同样的问题。我就是找不出为什么它在Firefox中可以工作而在IE（所有版本）中不能工作。按照你的方法检查了文档类型，果然不完整。其他开发人员中的一个肯定是从某个旧代码中复制过来的。无论如何，我们不使用xhtml strict，而是使用xhtml transitional，这样可以使colorbox在IE（所有版本）和Firefox中正常工作。以下是我用于使colorbox正常工作的代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
感谢Mariano在此事上给予的帮助。省去了许多沮丧的时间！
Toby Gutierrez
- Toby Gutierrez
网页内容由stack overflow 提供, 点击上面的可以查看英文原文，
原文链接
原文链接