Question

花了好几天试图弄清楚这一点，但也许是不可能的。

我正在使用jquery灯箱和一个单独的主页面导航，用于多个具有lighbox功能的图库。

我想将jquery灯箱叠加层嵌入div中，因此它不会覆盖整个窗口但只涉及它所在的div？

原因是 - 我希望无需点击叠加即可访问主导航，我希望灯箱内容保持在设置参数（即页面的容器）内，而不是在使用不同的屏幕分辨率时移动因此不能与主导航栏和标题对齐。

任何建议：jquery脚本，插件，用于使这成为可能，如果可能的话。或者其他建议将不胜感激。

谢谢

Answer 1

我认为您可能不得不取消使用灯箱插件提供的叠加层并自行完成。

创建叠加层的过程很简单。我可以在这里重新发明轮子，或者我可以发送一些像这篇博文：http://raventools.com/blog/create-a-modal-dialog-using-css-and-javascript/

查看带有#overlay类的overlay div？您需要做的就是将其大小设置为容器，将div重叠放在该容器中并设置容器样式position: relative。

你可以选择在JavaScript端忽略所有帖子的实现并将其替换为你最喜欢的模态插件，但是你需要绑定到模态对话框上的show / hide事件来显示/隐藏你的自定义叠加，当然应该是可能的。但是，这样做的具体细节因您选择的插件而异。

Answer 2

我正遇到一个问题，我的灯箱正在页面下方加载。问题是在css文件中包含代码

当灯箱在页面下加载时我写过这一行

<link  type="text/css" href="css/jquery.lightbox-0.5.css" media="screen" />

仅在链接标记

中包含rel =“stylesheet”

<link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.5.css" media="screen" />

我的问题已解决