JQuery CSS 代码不在窗口中间答案

【问题标题】：JQuery CSS code doesn't center in the middle of the windowJQuery CSS 代码不在窗口中间
【发布时间】：2011-07-10 11:15:16
【问题描述】：

我这里有这段代码

http://forum.castoff.net/menu.php

消息框出现在整个页面的中间...我需要它出现在可视区域的中间..

有人可以帮忙吗？？

我确定这只是 CSS 问题

谢谢

李

【问题讨论】：

标签： jquery css window center centering

【解决方案1】：

您将“dim”设置为 50% 的顶部位置，因此它将位于页面的 50%，而不是可视区域。

试着用这个来居中：

function centerMe(element) {
    //pass element name to be centered on screen
    var pWidth = $(window).width();
    var pTop = $(window).scrollTop()
    var eWidth = $(element).width()
    var height = $(element).height()
    $(element).css('top', pTop + 100+'px')
    $(element).css('left', parseInt((pWidth / 2) - (eWidth / 2)) + 'px')
}

【讨论】：

您好 Diodeus，我已经将该代码放入并为其指定了元素 ID，但它仍然以整个页面而不是可视区域为中心:-(
为 msgbox 移除 CSS 中的顶部/左侧样式。要使脚本正常工作，“msgbox”不应是“dim”的子代。它应该是“body”的孩子。

【解决方案2】：

table 和#dim 的高度为2000px 及以上，因此为弹出窗口提供top:50% 将其放在其父级的中间。删除table 的高度，看看这是否有效（可能会起作用，因为#dim 的高度是文档的高度。）。

另一个选项是为.msgbox 添加一个与顶部的距离的固定值。例如，在您的 css 中，您可以将 .msgbox {top:50%;} 更改为 .msgbox {top:200px;}

【讨论】：

【解决方案3】：

您只需打开.msgbox，将position: absolute 更改为position: fixed。

就是这样。

阅读本文以了解不同的 position 值：
http://css-tricks.com/absolute-relative-fixed-positioining-how-do-they-differ/

【讨论】：

完美的解决方案...任何线索为什么调暗背景和 msgbox 不会超过 youtube 嵌入式视频？我已添加到 URL 以向您展示
这确实是一个单独的问题，但之前已经被问过很多次了，所以：你基本上需要wmode = transparent，两次：一次像这样：<param name="wmode" value="transparent"></param>，一次在你的@ 987654329@ 标签：<embed .. wmode="transparent" ..></embed>.