弹出div浮动登陆框 背景变灰

 [html] view
plaincopy

<!--要浮动的框子-->  

         <div class="quitOKorNo" id="quitOKorNo" >  

                 

         </div>  

[css] view
plaincopy

.quitOKorNo{ display:none; position:absolute;  background-color:White;    z-index:200;width:200px; border:1px #F8CFA5 solid; font-size:12px; height:50px; color:Black; line-height:50px; text-align:center}  

[css] view
plaincopy

#greybackground { background:#000; display:block; z-index:100; width:100%; position:absolute; top:0; left:0;}  

[javascript] view
plaincopy

$("#quitOKorNo").html("打开弹出框和设置背景框！");  

                           $("#quitOKorNo").fadeIn(100);  

                           $("body").append("<div id='greybackground'></div>");  

                           var documentheight = $(window.document).height();//获取此页面高度，包括下拉部分  

                           $("#greybackground").css({"opacity":"0.3","height":documentheight});  

[javascript] view
plaincopy

//浮动框的效果 和位置设定js代码  

[javascript] view
plaincopy

var screenwidth,screenheight,mytop,getPosLeft,getPosTop  

screenwidth = $(window).width();  

screenheight = $(window).height();  

mytop = $(document).scrollTop();  

getPosLeft = screenwidth/2 - 100;  

getPosTop = screenheight/2 - 150;  

$("#quitOKorNo").css({"left":getPosLeft,"top":getPosTop+80});  

$(window).resize(function()  

{  

    screenwidth = $(window).width();  

    screenheight = $(window).height();  

    mytop = $(document).scrollTop();  

    getPosLeft = screenwidth/2 - 100;  

    getPosTop = screenheight/2 - 150;  

    $("#quitOKorNo").css({"left":getPosLeft,"top":getPosTop+mytop+80});  

});  

  

//滚动条事件  

$(window).scroll(function()  

{  

    screenwidth = $(window).width();  

    screenheight = $(window).height();  

    mytop = $(document).scrollTop();  

    getPosLeft = screenwidth/2 - 100;  

    getPosTop = screenheight/2 - 150;  

    $("#quitOKorNo").css({"left":getPosLeft,"top":getPosTop+mytop+80});  

});