Question

我正在尝试在我的网站上实现以下jQuery popout功能： http://yensdesign.com/2008/09/how-to-create-a-stunning-and-smooth-popup-using-jquery/ 然而，我弹出窗口，而不是它在窗口中间居中，似乎弹出窗口使用背景图像作为容器，然后输入我正在那里使用的窗体。因此表格甚至不完全可见。我试图让弹出窗口居中在窗口中，以便表单完全可见。我也使用此表单教程作为我的表单模板：http://tympanus.net/codrops/2010/06/07/fancy-sliding-form-with-jquery/

为什么它只是奇怪的任何想法？我对jQuery很新，所以显然我做错了，但我不知道。我做了一些研究，并在centerPopup（）函数下的popup.js文件中尝试了不同的DOM对象引用，但我尝试的任何内容都不会影响弹出窗口。它只会影响表单的显示位置......

我已经在这个工作了两个小时，所以我很有智慧，并且感谢你能给予的任何帮助。谢谢。

这是JSFiddle：http://jsfiddle.net/LxjN2/11/

修改

要按照我的想法进入“弹出窗口”或弹出窗口，您必须单击菜单栏上的“职业”选项卡，然后单击“请按下我！”按钮。然后你会看到弹出窗口。

Answer 1

你的问题（如果我理解正确的话）是你的HTML嵌套。您的<div id="popupContact">是从其启动的面板的子元素，并且沿着该线的某个面板的某个父元素将其overflow css属性设置为hidden。这就是它被切断的原因。

将popupContact div移动到面板div之外（可能就在你的结束body标签下方），它将在主窗口的上下文中呈现，而不是在面板内被切断。 / p>

祝你好运。

编辑：此外，你的“花式滑动形式”有一个z-index，它胜过你的弹出窗口。要解决这个问题，只需更改你的centerPopup js函数，使其包含一个大于1000的z-index ......就像这样：

$("#popupContact").css({
    "position": "absolute",
    "top": windowHeight/2-popupHeight/2,
    "left": windowWidth/2-popupWidth/2,
    "z-index": 2000 
});

jQuery popup居中不正确

1 个答案: