开发者

jQuery lightbox problem

I got two divs, one is a background and the other is the container for a vid which is on top of the former. Another div serves as a button that when clicked, it triggers the lightbox. Here's my code:

//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

$("#background开发者_Go百科Popup").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();
    }
});
});

I should mention that I didn't create this code, I just modified it to fit my needs. The problem here is that when I click anywhere on the page except the button div, the background div of the lightbox pops up. And when I close the vid container, the background div remains visible which is not what I want. Could you pls tell me what's wrong with my code?


Maybe I'm missing something, but it looks like the buttonDivID is only being set in the whichDiv function, which is never being called. I would start there...

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜