電腦中設(shè)置彈窗的相關(guān)代碼
復(fù)制代碼 代碼如下:
//窗口的高度
var windowHeight;
//窗口的'寬度
var windowWidth;
//彈窗的高度
var popHeight;
//彈窗的寬度
var popWidth;
//滾動(dòng)條滾動(dòng)的高度
var scrollTop;
//滾動(dòng)條滾動(dòng)的寬度
var scrollleft;
//延時(shí)的時(shí)間
var timeout;
function init(){
//獲得窗口的高度
windowHeight=$(window).height();
//獲得窗口的寬度
windowWidth=$(window).width();
//獲得彈窗的高度
popHeight=$(".window").height();
//獲得彈窗的寬度
popWidht=$(".window").width();
//獲得滾動(dòng)條的高度
scrollTop=$(window).scrollTop();
//獲得滾動(dòng)條的寬度
scrollleft=$(window).scrollLeft();
}
//定義關(guān)閉窗口
function closeWindow(){
$(".title img").click(function (){
$(this).parent().parent().hide("slow");
});
}
//定義彈出窗口的方法
function popcenterWindow(){
//先清空上一次的延遲
clearTimeout(timeout);
timeout=setTimeout(function (){
init();
var popY=(windowHeight-popHeight)/2+scrollTop;
var popX=(windowWidth-popWidht)/2+scrollleft;
$("#center").animate({top:popY,left:popX},300).show("slow");},300);
closeWindow();
}
function popleftWindow(){
clearTimeout(timeout);
timeout=setTimeout(function (){
init();
var popY=windowHeight+scrollTop-popHeight-10;
var popX=scrollleft-5;
$("#left").animate({top:popY,left:popX},300).show("slow");},300);
closeWindow();
}
function poprightWindow(){
clearTimeout(timeout);
timeout=setTimeout(function (){
init();
var popY=windowHeight-popHeight+scrollTop-10;
var popX=windowWidth-popWidht+scrollleft-10;
$("#right").animate({top:popY,left:popX},300).show("slow");},300);
closeWindow();
}
CSS
復(fù)制代碼 代碼如下:
.window{
width:250px;
background-color:#3FF;
padding:2px;
margin:5px;
position:absolute;
display:none;
}
.content{
height:150px;
background-color:#FFF;
padding:2px;
font-size:14px;
overflow:auto;
}
.title{
padding:2px;
color:#999;
font-size:14px;
}
.title img{
float:right;
cursor:pointer;
}
【電腦中設(shè)置彈窗的相關(guān)代碼】相關(guān)文章：
電腦一直彈窗怎么解決11-29
電腦中病毒怎么處理05-29
描寫電的成語02-24
參考文獻(xiàn)代碼介紹01-29
海關(guān)國別地區(qū)代碼表03-30
征免性質(zhì)代碼表概括02-03
關(guān)于電商的調(diào)研報(bào)告07-29
電關(guān)于話面試的技巧03-17