Exacto, eso lo hice de la forma que te puse arriba.
Cree una variable con el valor "false"
y puse que cuando estoy ensima del globo la variable cambie a "true".
Eso por un lado, por otro lado digo que si hago click en body ( osea toda la web, el globo se cierre, pero antes de eso compruebo si la variable es "false" ).
Conclución el globo se cierra si hago click en body pero no estoy ensima del globo.
Lo de situar el div al medio centrado es algo así:
a modo de ejemplo:
Si tienes un div de 100px X 100px y lo quieres centrar en el medio de la pantalla debes de colocarlo con posicion absolute
a 50% de left
y a 50% de top
y le das margin-top -50px
y margin-left -50px.
el cod queda css es:
Código:
clase_del_div
{
position: absolute;
width: 100px;
height: 100px;
top: 50%;
left: 50%;
margin-top: -50px; /*al margen top le restas la mitad de su alto*/
margin-left: -50px; /*al margen left le restas la mitad de su ancho*/
}
Y si quieres que este div se mueva con el scroll y dejarle el fondo oscuro semitransparente, debes de crear un div padre con width 100%, height 100% y position fixed con el background del png semitransparente