jQuery彈出窗口完整代碼(居中,居左,居右)
更新時間:2012年10月10日 00:53:39 作者:
jQuery彈出窗口完整代碼,可以實現(xiàn)窗口居中,居左,居右顯示,比較不錯,需要的朋友可以參考下
核心代碼:
//獲取窗口的高度
var windowHeight;
//獲取窗口的寬度
var windowWidth;
//獲取彈窗的寬度
var popWidth;
//獲取彈窗高度
var popHeight;
function init(){
windowHeight=$(window).height();
windowWidth=$(window).width();
popHeight=$(".window").height();
popWidth=$(".window").width();
}
//關(guān)閉窗口的方法
function closeWindow(){
$(".title img").click(function(){
$(this).parent().parent().hide("slow");
});
}
//定義彈出居中窗口的方法
function popCenterWindow(){
init();
//計算彈出窗口的左上角Y的偏移量
var popY=(windowHeight-popHeight)/2;
var popX=(windowWidth-popWidth)/2;
//alert('www.dhdzp.com');
//設(shè)定窗口的位置
$("#center").css("top",popY).css("left",popX).slideToggle("slow");
closeWindow();
}
function popLeftWindow(){
init();
//計算彈出窗口的左上角Y的偏移量
var popY=windowHeight-popHeight;
//var popX=-(windowWidth-popWidth);
//alert(popY);
//設(shè)定窗口的位置
$("#left").css("top",popY-50).css("left",50).slideToggle("slow");
closeWindow();
}
function popRightWindow(){
init();
//計算彈出窗口的左上角Y的偏移量
var popY=windowHeight-popHeight;
var popX=windowWidth-popWidth;
//alert(www.cnblogs.com/jihua);
//設(shè)定窗口的位置
$("#right").css("top",popY-50).css("left",popX-50).slideToggle("slow");
closeWindow();
}
完整代碼:
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
作者 cnblogs jihua
復(fù)制代碼 代碼如下:
//獲取窗口的高度
var windowHeight;
//獲取窗口的寬度
var windowWidth;
//獲取彈窗的寬度
var popWidth;
//獲取彈窗高度
var popHeight;
function init(){
windowHeight=$(window).height();
windowWidth=$(window).width();
popHeight=$(".window").height();
popWidth=$(".window").width();
}
//關(guān)閉窗口的方法
function closeWindow(){
$(".title img").click(function(){
$(this).parent().parent().hide("slow");
});
}
//定義彈出居中窗口的方法
function popCenterWindow(){
init();
//計算彈出窗口的左上角Y的偏移量
var popY=(windowHeight-popHeight)/2;
var popX=(windowWidth-popWidth)/2;
//alert('www.dhdzp.com');
//設(shè)定窗口的位置
$("#center").css("top",popY).css("left",popX).slideToggle("slow");
closeWindow();
}
function popLeftWindow(){
init();
//計算彈出窗口的左上角Y的偏移量
var popY=windowHeight-popHeight;
//var popX=-(windowWidth-popWidth);
//alert(popY);
//設(shè)定窗口的位置
$("#left").css("top",popY-50).css("left",50).slideToggle("slow");
closeWindow();
}
function popRightWindow(){
init();
//計算彈出窗口的左上角Y的偏移量
var popY=windowHeight-popHeight;
var popX=windowWidth-popWidth;
//alert(www.cnblogs.com/jihua);
//設(shè)定窗口的位置
$("#right").css("top",popY-50).css("left",popX-50).slideToggle("slow");
closeWindow();
}
完整代碼:
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
作者 cnblogs jihua
相關(guān)文章
jQuery使用getJSON方法獲取json數(shù)據(jù)完整示例
這篇文章主要介紹了jQuery使用getJSON方法獲取json數(shù)據(jù),結(jié)合完整實例形式分析了getJSON方法讀取與遍歷json文件數(shù)據(jù)的相關(guān)技巧,需要的朋友可以參考下2016-09-09
jQuery實現(xiàn)側(cè)邊導(dǎo)航欄及滑動電梯效果(仿淘寶)
這篇文章主要介紹了如何利用JQuery+CSS模擬淘寶實現(xiàn)側(cè)邊導(dǎo)航欄以及滑動電梯效果,文中的示例代碼講解詳細,感興趣的小伙伴可以動手試一試2022-03-03
jquery.uploadify插件在chrome瀏覽器頻繁崩潰解決方法
這篇文章主要介紹了jquery.uploadify插件在chrome瀏覽器頻繁崩潰解決方法,十分的實用,遇到相同問題,需要解決的朋友可以參考下2015-03-03

