Popup Div HTML5仅使用CSS和基本/纯JavaScript

Question

请注意：对于我的网站托管公司，jQuery（非常不幸） NOT 是我的选项，我无法链接到外部 JS或CSS文件。我的popup div包含我网页“head”部分中的 CSS AND JS 代码作为解决方法。

我的问题希望只需要对我现有的JS进行简单的更新/调整。一个星期前，我网站上的弹出式Div（用于联系表格）运行100％正确（除了位置：IE中我已经放弃的固定问题）。好吧，我的托管公司刚刚切换到HTML5（我相信“DTD 4.01 Transitional”），现在我的弹出式div在任何浏览器（IE9，FF，Chrome，Safari）中都无法正常运行，有些比其他浏览器差。

要解决的问题是（请访问我的网站http://solitairethahalo.com以查看其中的操作）：

• 已修复 （所有4个浏览器）“line-height”html标记我用来格式化联系表单说明/信息不再有效;因此，“Form”div类现在大于div容器高度
• 75％已修复 （Firefox＆amp; IE）定位不正确;弹出窗口出现在屏幕底部，这样只能看到弹出窗口标题的一小部分
• 50％FIXED （所有4个浏览器）我现有的弹出窗口从未有过代码，但我想让弹出窗口div保持居中/固定浏览器窗口尽可能调整大小

我无法正确粘贴现有代码，因此我可以通过我的网站访问该代码：http://solitairethahalo.com/popupdiv.txt

如果可能，请提供（如有必要，可以通过电子邮件发送给我）我现有代码的HTML5兼容版本。

谢谢！

---

更新

• 行高：在查找并了解之后，我通过简单地更改为修复了问题。很高兴很简单。
• 弹出定位＆amp;调整大小：通过稍微调整现有代码来修复定位错误。使用下面评论中的js代码，我可以在窗口大小调整时获得弹出窗口所需的重新定位。但是，我一直无法使用该代码创建模态窗口函数。所以现在，我已经恢复了我自己修改的代码，目前缺少重新定位的重新定位功能，但我仍然在努力。

Answer 1

如果你不能使用任何JS，那么只能用一种方式。

你可以做一件事，或者用popup替换它用滑动面板。 添加你的popup div＆＃34; contact＆＃34; DIV。从CSS3鼠标悬停你的＆＃34;联系＆＃34; div，使用css3过渡并将其位置设置为显示弹出窗口。

这适用于所有浏览器。动画无法在IE8或更低版本中使用。