Ocultar div al pinchar fuera de el

[roal40]

Buenas, he hecho un apartado de notificaciones, en el que al darle, con un onclick, se vuelve un display:block y se muestran las notificaciones, pero para cerrarlo o le das al icono de nuevo o no se cierra... me gustaria que al dar fuera del div, en cualquier otro sitio, se cerrase...

Código HTML:

<a href="javascript:void(0)" id="mostrarnotificacion" onClick="document.getElementById('notificaciones').style.display = ' block ';document.getElementById('mostrarnotificacion').style.display = ' none ';document.getElementById('ocultarnotificacion').style.display = ' block ';document.getElementById('left_arrow_notificaciones').style.display = ' block ';">
    <div class="notification"></div>
    <div class="titulo"><p>Alertas</p></div>
    </a>
    <a href="javascript:void(0)" id="ocultarnotificacion" onClick="document.getElementById('notificaciones').style.display = ' none ';document.getElementById('mostrarnotificacion').style.display = ' block ';document.getElementById('ocultarnotificacion').style.display = ' none ';document.getElementById('left_arrow_notificaciones').style.display = ' none ';">
    <div class="notification"></div>
    <div class="titulo"><p>Alertas</p></div>
    </a> 

[PIRRUMAN]

Has pensado en utilizar el onblur?

[Dafonz]

No creo que sea el caso solo con onblur, si es un click en cualquier cosa fuera de esa ventana yo solo lo he hecho con JQuery y con event.stopPropagation() y agregando un listener al click en document o alguna otra cosa de afuera.
Debe de poderse con javascript normal, pero la verdad desconozco. Suerte

[labregamusiclbm]

discurpen que cambie el TEMA pero es que soy nuevo en este foro y no se como poner una pregunta para que alguen pueda ayudarme, agradesco de antemano la posible ayuda que me puedan dar

[roal40]

Iniciado por PIRRUMAN

Has pensado en utilizar el onblur?

Segun me estoy informando, eso es para formularios...

Yo quiero que el div notificaciones cuando deje de estar en el y pinche fuera de el se cierre, pero el div notificaciones no es un form... xD

Siento mi ignorancia... xD

[roal40]

Iniciado por Dafonz

No creo que sea el caso solo con onblur, si es un click en cualquier cosa fuera de esa ventana yo solo lo he hecho con JQuery y con event.stopPropagation() y agregando un listener al click en document o alguna otra cosa de afuera.
Debe de poderse con javascript normal, pero la verdad desconozco. Suerte

Podrias decirme como? Esque estoy haciendo una red social, y estoy haciendo un diseño que sea como un escritorio... y entonces acabo de empezarlo de 0 y para que quede lo mejor posible me gustaría poder hacer eso...

Te dejo una foto... la cosa, es que no se muestren dos menús a la vez... si no que uno... y al pinchar en el otro, el anterior se oculta y el nuevo se muestra... (Eso lo sé hacer con los onclick, pero si pincho en cualquier otra parte de la pantalla no...)



PD: El fondo es el de twitter porque era un fondo que como wallpaper (Se puede cambiar) me gusta bastante...
PD2: La red social está hecha, pero estoy re-diseñando, en 1 año la lanzaré con subida de archivos, vídeos y muuuchas más cosas

[Kritik]

Cada código que hace visible un div lleva consigo el código que hace invisible el resto de divs. Y arreglado.

si div1==visible

entonces:
div2=invisible
div3=invisible
div4=invisible
etc...

si div2==visible
div1=invisible
div3=invisible
div4=invisible
etc...

[Kritik]

Iniciado por roal40

(Eso lo sé hacer con los onclick, pero si pincho en cualquier otra parte de la pantalla no...)

En el resto de la pantalla también habrá divs... que tienen disponible el evento onclick.

[chinanzio]

Una pregunta roal40, la notificación es bloqueante ??, quiero decir, al mostrar la notificación todo el resto de la página quedaría en segundo plano ?
Me estoy imaginando que tu notificación es el tipico cartel que aparece centrado en la pantalla
Si esto es asi yo alguna vez hice una cosa asi:

Código HTML:

 <div> <!-- div que cubre la pantalla completa -->
        <div>
            Texto de la notificación
        </div>
    </div> 

El primer div tendría como atributos css algo como lo siguiente
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background-color: transparent;
z-index: 10;

luego centrar la notificación dentro de ese div y capturar el evento click del prier div para ocultarlo todo

Se entiende, es que me explico muy mal aveces

Saludos

[emprear]

Con puro javascript, asi
http://foros.emprear.com/javascript/...as-ctexto.html

en el código fuente están todos los detalles

SAludos

[roal40]

Iniciado por chinanzio

Una pregunta roal40, la notificación es bloqueante ??, quiero decir, al mostrar la notificación todo el resto de la página quedaría en segundo plano ?
Me estoy imaginando que tu notificación es el tipico cartel que aparece centrado en la pantalla
Si esto es asi yo alguna vez hice una cosa asi:

Código HTML:

 <div> <!-- div que cubre la pantalla completa -->
        <div>
            Texto de la notificación
        </div>
    </div> 

El primer div tendría como atributos css algo como lo siguiente
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background-color: transparent;
z-index: 10;

luego centrar la notificación dentro de ese div y capturar el evento click del prier div para ocultarlo todo

Se entiende, es que me explico muy mal aveces

Saludos

No, no deja el resto en segundo plano, es como un menú extra

Iniciado por emprear

Con puro javascript, asi
http://foros.emprear.com/javascript/...as-ctexto.html

en el código fuente están todos los detalles

SAludos

Gracias, mañana lo pruebo :)