jquery - 如何创建 Speaker 的弹出窗口？

Question

我已经在我的站点中实现了 Projekktor Speakker。我想创建一个弹出窗口，询问您是否要播放音乐。

我怎样才能做到这一点？

谢谢！

---

编辑：

我想知道的是如何将 Speakker 召回到我的弹出窗口中，而不是如何创建弹出窗口！.. 抱歉，如果我不清楚！我将为此打开一个单独的问题。

Answer 1

See demo

Basically create two div one is the div that will cover the entire background. Second is the div which is your actual popup.

HTML:

<div id="mask"></div>
<div id="popup"><h2>Do you want to play music?</h2></div>​

CSS:

#mask
{
height:100%;
width:100%;
position:absolute;
top:0;
left:0;
background-color:#DDD;
z-index:100;

}
#popup
{
height:200px;
width:300px;
-webkit-border-radius:10px;
border:5px solid #FFAd08;
background-color:#FFD69C;
z-index:101;
position:absolute;
left:50px;
top:100px;
}

Note:I have used styles just for demonstration you should style the popup as per your needs and position it the same way

Hope it helps.

Answer 2

试试这个：pop 将在页面加载时打开

css

.mover {
    width: 250px; 
    height: 150px; 
    background:#000; 
    position:absolute; 
    border:1px solid #f5f5f5; 
    display:none;
    z-index:1001;}

脚本

   var myscreen=screen.width;
   var popPos =  (myscreen - 250) /2;   //250 is the width of popup
   $(function() {
    $(window).load( function() {
        $('#special').show();
        $("#special").css({
            marginLeft: popPos+"px",
        });
    });
    });

html

   <div class="mover" id="special"></div>