标题: IE7 与 IE6 的模式窗口尺寸差异

作者: dnawo

日期: 2008-03-06 07:04 PM

内容: IE 的弹窗常用的有两种，不外乎是 window.open 与 window.showModalDialog，前者兼容性好，后者只有IE认识（Firefox的1.x版本与3.x版本支持window.open(url,handle,"modal=yes")，这是ff的模式窗口）。模式窗口由于其强制必须完成模式窗口的操作，当前window才能被继续使用，它的这一特性，使它在一些 Web Application 中应用较广，它的好处本文不赘述，这里要探究的是用 javascript 设置相同的窗口尺寸，模式窗口在 IE6 与 IE7 下竟然表现不一致。

执行语句：window.showModalDialog('b.html',window,'dialogWidth:250px; dialogHeight:250px;')，对比在 IE6 与 IE7 下的表现差异：
250*250 这一尺寸是特意设的，右图IE6的window尺寸严格按照设置的尺寸展示，但是左边的IE7展示结果却让人大吃一惊，为什么是 317*256 ?

认真分析一下317与256的数字，其中宽度 256 应该是设置的宽度再加上 window 的 border-width，即 250+3+3=256。而 317 的高度则应该是设置的高度再加上 titlebar(20px)、location(21px) 与 statusbar(20px) 的高度，还要加上 border-width(3px+3px)，即 250+20+21+20+3+3=317。用ps把右图移动到左图上，更能说明这一尺寸的变化：
IE6 的模式窗口刚好完整的覆盖到 IE7 窗口的内容区域上，IE7 的模式窗口露出了titlebar、location与statusbar，还有边框。
IE7 的这一变化给一些已定的模式窗口带来了不必要的麻烦，强行显示location与statusbar可以理解，但高度作如此变化却害苦的一班 web developer。看看 IEBlog 中的评论内容，群情激奋~
另外一个发现，IE7下的模式窗口存在最小宽度：250px ，奇怪的定义刚好用一个准确的数字来体现。

+ 查看当前日志评论 (0)

────────────

木子屋

PJBlog3 v3.2.9.518 Inside.

Processed In 0.016 ms

标题: IE7 与 IE6 的模式窗口尺寸差异

你没有权限发表评论

────────────

木子屋

PJBlog3 v3.2.9.518 Inside.

Processed In 0.016 ms

暂无评论

────────────

木子屋

PJBlog3 v3.2.9.518 Inside.

Processed In 0.031 ms