0

我有一个弹出 div 正在点击。我需要让弹出窗口出现在用户正在查看的浏览器中。现在在短页面上找不到弹出 div，在长页面上，您必须向下滚动才能看到弹出窗口。

到目前为止，我在我的 popUpDiv 中尝试了一些不同的东西，但没有成功。

margin: 30px auto 0;
    top: 50%;
    left: 50%;



 margin-left: -155px;
    margin-top: -700px;

这是我的CSS：

/*STYLES FOR CSS POPUP*/
#blanket {
   background-color:#111;
   opacity: 0.65;
   *background:none;
   position:absolute;
   z-index: 9001;
   top:0px;
   left:0px;
   width:100%;
}
#popUpDiv {
    padding: 40px;
    position:absolute;
    background-color: #f3f3f3;
    height:255px;
    border:5px solid #000;
    z-index: 9002;
    -moz-border-radius: 10px;
    -webkit-border-radius:10px;
    border-radius: 10px;
    margin-left: -155px;
    margin-top: -700px;
}
#popUpDiv a {position:relative; top:0px; right:10px}
/*END CSS POPUP*/

这是我的 php 文件中的内容：

<!--POPUP--> 
<script type="text/javascript" src="http://domain.com/js/css-pop.js"></script>

    <div id="blanket" style="display:none;">
    </div>
    <div id="popUpDiv" style="display:none;">


        Pop Up content Here


    </div>
<!-- / POPUP-->
4

2 回答 2

1

在 jscript 中做你想做的事情的方法不止几种，但凯迪拉克的方法可能是模态弹出窗口：http ://www.script-tutorials.com/css3-modal-popups/ 。

于 2013-02-06T23:00:55.557 回答
1

定位：固定会解决你的问题。你对 position: absolute 的使用造成了所有的戏剧性。

#popUpDiv {
    padding: 40px;
    position:fixed;
    background-color: #f3f3f3;
    height:255px;
    border:5px solid #000;
    z-index: 9002;
    -moz-border-radius: 10px;
    -webkit-border-radius:10px;
    border-radius: 10px;
}
于 2013-02-06T23:38:39.577 回答