CODEWITHSUNDEEP
jqueryhtmllightbox
user565794
user565794

Reputation: 1

Closing Lightbox Clicking Outside a Div

I'm using a simple lightbox & google maps jquery app to well, display a map inside my website.

However, the map doesn't include a function so that if you click outside of it the lightbox closes, it just has this:

gmClose = document.createElement("div");
    gmClose.setAttribute("id","gmlb_close");
    gmClose.setAttribute("class","gmlb_close");
    gmClose.style.display="block";
    gmClose.onclick=function(){gmOverlay.style.display='none';gmLbOnClose();};

I want people to be able to close the lightbox just by clicking outside the map or container:

gmContainer = document.createElement("div");
    gmContainer.setAttribute("id","gmlb_container");
    gmContainer.style.width=gmlb_width+"px";
    gmContainer.style.position="absolute";
    gmContainer.style.display="inline";

gmMap = document.createElement("div");
    gmMap.setAttribute("id","gmlb_map");
    gmMap.style.width=gmlb_width+"px";
    gmMap.style.height=gmlb_height+"px";
    gmMap.style.display="block";
    gmMap.style.float="left";
    gmMap.onclick=function(){return false;};

I've tried looking around to solve this but I haven't had any luck.

The url with the files can be located here:

http://www.emich.be/en/2007/03/01/google-maps-lightbox

Upvotes: 0

Views: 2316

Answers (1)

0xAli
0xAli

Reputation: 1059

I was googling about the same problem and i saw this question, but i found the answer and it's by using addEventListener()

var container=document.getElementById('gmlb_container');
container.addEventListener('click',closecontainer,true);


function closecontainer(){
var container=document.getElementById('gmlb_container');
container.style.display='none';
}

//I know this is few months late but i hope whoever comes here to find the answer gets this :)

Upvotes: 1

Related Questions