Varios menus desplegables se abren todo en solo click

[BekoxD]

Encontré un codigo para hacer un menu desplegable y me funciona perfecto cuando uso un solo menú por pagina, pero si quiero poner dos o más menus usando el mismo codigo da el detalle que cuando clickeo en un menu se abren el resto de los menus, quiero evitar que me salga eso... ¿me echan una mano?
Dejo el codigo...

Código PHP:

  $(document).ready(function() 
{ 
$(".socialshare").click(function() 
{ 
var X=$(this).attr('id'); 
if(X==1) 
{ 
$(".submenu").hide(); 
$(this).attr('id', '0'); 
} 
else { 
$(".submenu").show(); 
$(this).attr('id', '1'); 
} 
}); 
//Mouse click on sub menu 
$(".submenu").mouseup(function() 
{ 
return false 
}); 
//Mouse click on my account link 
$(".socialshare").mouseup(function() 
{ 
return false 
}); 
//Document Click 
$(document).mouseup(function() 
{ 
$(".submenu").hide(); 
$(".socialshare").attr('id', ''); 
}); 
});  
   

Código HTML:

<div class="dropdown">
   <a class="socialshare">Share</a>
    <div class="submenu">
      <ul class="root">
      <li ><a href="#Dashboard">Google+</a></li>
      <li ><a href="#Profile">Piterest</a></li>
      <li ><a href="#settings">Email</a></li>
      </ul>
     </div>
</div> 

[Alexis88]

Veo que intentas obtener el id del elemento sobre el que posas el cursor, pero no veo en la estructura que alguno de los elementos posea un valor en dicho atributo.

Particularmente, controlo a mis menúes desplegables con este pequeño script que hice:

Código Javascript:

$("nav li").hover(function(){
    $(this).find("ul").slideDown("slow").css("z-index", 1000);
}, function(){
    $(this).find("ul").slideUp("slow").css("z-index", 1);
});
 

Cuando posas al cursor sobre uno de los ítems de la lista, encuentro la lista desordenada que este posee, la muestro y la coloco varios niveles por encima del resto de elementos del DOM, de este modo, si hay algo abajo del menú, la lista que se despliega no quedará oculta.

Aplicando algunos estilos, así es como queda:



Para el ejemplo, utilicé dos menúes, solo para mostrarte que no ocurre el conflicto que mencionas con lo que tienes.

Saludos

[BekoxD]

@Alexis88 gracias por responder, pero lo que quiero es un menu desplegable solamente cuando hagan click en menu mas no un hover.

¿Hay algun modo de solucionar eso?

[Alexis88]

Cambia al método hover por click.

Saludos