Hide menu by clicking outside and leaving in js

Navigation
0

How to hide ul by clicking off the menu or hovering the mouse off the menu? I tried but I did not succeed. 

function aperfil(opthard){
	if(document.getElementById(opthard).style.display== "none"){
		document.getElementById(opthard).style.display = "block";}
		else {document.getElementById(opthard).style.display = "none"}
		
		
		} 
<ul class="menup">

             <li><a href="#"><img src="img/icones/perfil.png" width="27" height="22"  alt="" onClick="aperfil('perfil');"/></a>
                <ul id="perfil" style="display: none; border:1px solid #5589c4; background-color:#fff;">
                      <li><a href="/painel/alt_pass.php">Alterar Senha</a></li>
                      <li><a href="/painel/suporte.php">Suporte</a></li> 
                      <li><a href="?go=sair">Sair</a></li> 
                        </ul>
            </li>
            </ul>
    
asked by anonymous 05.02.2016 / 14:55

1 answer

1

Here at W3Schools has a good example.

Notice that by hovering over the image the bigImg function is called, and when it is called it calls the normalImg function. 

function bigImg(x) {
    x.style.height = "64px";
    x.style.width = "64px";
}

function normalImg(x) {
    x.style.height = "32px";
    x.style.width = "32px";
}
<img onmouseover="bigImg(this)" onmouseout="normalImg(this)" border="0" src="http://qnimate.com/wp-content/uploads/2014/03/images2.jpg"alt="Smiley" width="32" height="32">
    
05.02.2016 / 16:34
Angular Links Load and set asynchronous bitmap