Yourself_jquery で HTML 疑似ポップアップボックスの実装コードを追加できます。-jsチュートリアル-php.cn

Yourself_jquery で HTML 疑似ポップアップボックスの実装コードを追加できます。

WBOY

リリース： 2016-05-16 17:23:12

オリジナル

1271 人が閲覧しました

 
var PopupStatus = 0; 
//jQuery マジックを使用してポップアップを読み込みます! 
function loadPopup(){ 
//無効な場合にのみポップアップを読み込みます 
if(popupStatus==0){ 
$("#backgroundPopup").css({ 
"opacity ": "0.7" 
}); 
$("#backgroundPopup").fadeIn("遅い"); 
$("#popupContact").fadeIn("遅い"); 
ポップアップステータス = 1; 
} 
} 
//jQuery マジックでポップアップを無効にします! 
function disablePopup(){ 
//有効な場合にのみポップアップを無効にします 
if(popupStatus==1){ 
$("#backgroundPopup").fadeOut("slow"); 
$("#popupContact").fadeOut("遅い"); 
ポップアップステータス = 0; 
} 
} 
//ポップアップをセンタリング 
function centerPopup(){ 
//センタリングのためのデータを要求 
var browser=navigator.userAgent; 
var windowWidth = document.documentElement.clientWidth; 
var windowHeight = document.documentElement.clientHeight; 
var stop=""; 
var sleft=""; 
if(browser.indexOf('Chrome')!=-1){ 
stop=document.body.scrollTop; 
sleft=document.body.scrollLeft; 
} 
else{ 
stop=document.documentElement.scrollTop; 
sleft=document.documentElement.scrollLeft; 
} 
// windowWidth =document.body.scrollLeft; 
// windowHeight =document.body.scrollTop; 
var PopupHeight = $("#popupContact").height(); 
var PopupWidth = $("#popupContact").width(); 
//センタリング 
$("#popupContact").css({ 
"position": "absolute", 
"top": windowHeight/2-popupHeight/2 stop, 
 "左": windowWidth/2-popupWidth/2 左 
}); 
//IE6 の場合のみ強制が必要です 
//背景色 
$("#backgroundPopup").css({ 
"height": windowHeight 
}); 
} 
//调用弹出框イベント 
function bb(str){ 
$("#download").show(); 
centerPopup(); 
loadPopup(); 
//ポップアップを閉じます 
//x イベントをクリックしてください! 
$("#popupContactClose").click(function(){ 
disablePopup(); 
}); 
//クリックアウトイベント!，点击背景イベント 
$("#backgroundPopup").click(function(){ 
disablePopup(); 
}); 
//脱​​出イベントを押してください! 
$(document).keypress(function(e){ 
if(e.keyCode==27 && PopupStatus==1){ 
disablePopup(); 
} 
}); 
} 