Newsgroup: it.comp.lang.javascript
Titolo: onmouseout su div con link..

Ciao NG, problema semplice (credo..):
con un click su un link faccio comparire un div normalmente nascosto.
Nel DIV c'è un "onmouseout" per farlo scomparire quando il puntatore
esce dal DIV. Fino a qui tutto ok, il problema sta nel fatto che in
questo div, una sorta di menu contestuale, ci sono dei link e quando
passo col puntatore sopra i link, il div scompare :(
Pagina di prova:
http://www.kailed.net/menutest.html
nel sorgente c'è anche la funzione js..
Come si risolve ?
Ciao e grazie.
-- 
*** Linux user # 198661 --- ICQ 33500725 ***
***  Home  
http://web.tiscali.it/kailed
  ***
       ***  Powered by SuSeLinux  ***

 Come si risolve ?
Di approcci ce ne potrebbero essere diversi. Potresti ad esempio verificare
che l'elemento sul quale il puntatore è andato, sia sempre "figlio" del menu.
Qualcosa del genere:
	function hide(evt){
 
		evt = evt || window.event;
 
		var sender 	= evt.target||evt.srcElement,
			related = evt.relatedTarget || evt.toElement;
 
		if (related!= this && related.parentNode!=this){
			this.style.display="none";
		}		
	}
Nota: questo tiene conto di un solo livello di "parentela", se ci sono nodi
annidati, devi ciclarti il parentNode finché non è euguale all'elemento che fa
da menu oppure a null (e in tal caso non farai nulla).
Dato che il link che hai postato, risulta con un codice un po' datato, ti
scrivo un esempio "funzionante" che implementa la funzione di cui sopra, che
potrebbe esserti utile:
<!-- css -->
<style type="text/css">
	#vector{
		display:none;
		font:menu;
		border:1px solid silver;
		width:100px;
		padding:4px;
	}
	#vector a{
		text-decoration:none;
		display:block;
		padding:3px;
		width:100%;
		color:blue;
	}
	#vector a:hover{
		background:silver;
		color:#fff;
	}
</style>
<!-- js -->
<script type="text/javascript">
	function hide(evt){
 
		evt = evt || window.event;
 
		var sender 	= evt.target||evt.srcElement,
			related = evt.relatedTarget || evt.toElement;
 
		if (related!= this && related.parentNode!=this){
			this.style.display="none";
		}		
	}
	function show(id){
		document.getElementById(id).style.display="block";
	}
	window.onload=function(){
		document.getElementById("vector").onmouseout=hide;
	}
</script>
<!-- body -->
<button onclick="show('vector')">Vector Machines</button>
<div id="vector">
	Choose a vector machine:<br />
	<a href="#">Sol</a>
	<a href="#">Luna</a>
	<a href="#">Mars</a>
</div>
-- 
"E' un vero peccato che tutte le persone che sanno come far funzionare 
il Paese siano troppo occupate a guidare taxi o a tagliare capelli."
(George Burns)

 Come si risolve ?
Di approcci ce ne potrebbero essere diversi. Potresti ad esempio verificare





		padding:0 3px 0 3px;



In ogni caso non è il solo modo, ripeto. Ma è il primo che al momento mi è
venuto in mente. :)


 Come si risolve ?
Di approcci ce ne potrebbero essere diversi. Potresti ad esempio verificare





		padding:3px 0 3px 0;




P.S.
Ach.. di mattina ultimamente sono un po' troppo sfasato.. Se ci fossero
problemi fammi sapere.


 "figlio" del menu. Qualcosa del genere:
Per adesso un bel link "chiudi", in futuro vedremo.
Mica per altro ma sto facendo un piccolo filemager (in php) e ogni file
avrà il suo menù con delle "actions" in funzione del tipo di file.
Quindi saranno possibili dei sotto-menù, casi in cui il menù dovra
rimanere visibile anche dopo il click sul link, varianti varie...
Quindi per adesso mi salvo questo post, eventualmente riprenderò in mano
la questione se quella "features" sarà ancora
necessaria/utile/applicabile.
