2010-07-17 3 views
0

두 개의 div가 있는데, 하나는 배경이고 다른 하나는 전자 상단에있는 vid 컨테이너입니다. 다른 div는 클릭 할 때 라이트 박스를 트리거하는 버튼 역할을합니다. 여기 내 코드는 다음과 같습니다.jQuery 라이트 박스 문제

//0 means disabled; 1 means enabled; 

var popupStatus = 0; 
var buttonDivID = ""; 
var conDivID = ""; 

//determine which div is clicked 

function whichDiv(div) { 
    if(div==1){ 
     buttonDivID = "#vid"; 
     conDivID = "#popupContact"; 
    } 
} 

//loading popup with jQuery magic! 

function loadPopup(){ 

    //loads popup only if it is disabled 

if(popupStatus==0){ 

    $("#backgroundPopup").css({ 

     "opacity": "0.7" 

    }); 

    $("#backgroundPopup").fadeIn("slow"); 

    $(conDivID).fadeIn("slow"); 

    popupStatus = 1; 
} 
} 

//disabling popup with jQuery magic! 

function disablePopup(){ 

//disables popup only if it is enabled 

if(popupStatus==1){ 

    $("#backgroundPopup").fadeOut("slow"); 

    $(conDivID).fadeOut("slow"); 

    popupStatus = 0; 
    buttonDivID = ""; 
    conDivID = ""; 
} 
} 

//centering popup 

function centerPopup(){ 

//request data for centering 

var windowWidth = document.documentElement.clientWidth; 

var windowHeight = document.documentElement.clientHeight; 

var popupHeight = $(conDivID).height(); 

var popupWidth = $(conDivID).width(); 

//centering 

$(conDivID).css({ 

    "position": "absolute", 

    "top": windowHeight/2-popupHeight/2, 

    "left": windowWidth/2-popupWidth/2 
}); 

//only need force for IE6 

$("#backgroundPopup").css({ 

    "height": windowHeight 

}); 
} 

//CONTROLLING EVENTS IN jQuery 

$(document).ready(function(){ 

//LOADING POPUP 

//Click the button event! 

$(buttonDivID).click(function(){ 

    //centering with css 

    centerPopup(); 

    //load popup 

    loadPopup(); 
}); 


//CLOSING POPUP 

//Click the x event! 

$("#popupContactClose").click(function(){ 

    disablePopup(); 

}); 

//Press Escape event! 

$(document).keypress(function(e){ 

    if(e.keyCode==27 && popupStatus==1){ 

     disablePopup(); 
    } 
}); 
}); 

나는이 코드를 만들지 않았고, 필자의 필요에 맞게 수정했습니다. 여기서 문제는 버튼 div를 제외한 페이지의 아무 곳이나 클릭하면 라이트 박스의 배경 div가 튀어 나오는 것입니다. 그리고 vid 컨테이너를 닫을 때 배경 div는 내가 원하는 것을 볼 수 있습니다. 내 코드에 무엇이 잘못된지 말해 줄 수 있습니까?

답변

1

어쩌면 내가 누락되었지만 buttonDivID이 호출되지 않는 whichDiv 함수에서만 설정되는 것처럼 보입니다. 나는 거기서 시작할 것입니다 ...

+0

html 페이지에서 호출되었습니다 : 청취자 내부에서 그것을 호출해야합니까? – Joann

+0

방금 ​​해결했습니다. 네가 옳아. 그냥 whichDiv (div) 줄을 추가했습니다. 나는 그렇게 사소하다는 것을 알지 못한다. 나는 jQuery에 익숙하지 않다. :-) – Joann