No me da tiempo clicklar en menu jQuery+CSS

[X3mdesign]

Hola foro!!! He optado por poner en un botón "Compartir" los dibujos de mi galería manga, las redes sociales aparecen en una caja, pero a menudo, cuando pincho en el botón se despliega y cuando intento poner el ratón encima de cierra la caja...

Os pongo el código que he utilizado:

Código:

<script>

$(document).ready(function(){
	$("ul.subShare").parent().append("<span></span>"); //Only shows drop down trigger when js is enabled (Adds empty span tag after ul.subShare*)
	$("ul.topShare li").click(function() { //When trigger is clicked...
		//Following events are applied to the subShare itself (moving subShare up and down)
		$(this).parent().find("ul.subShare").slideDown('fast').show(); //Drop down the subShare on click
		$(this).parent().hover(function() {
		}, function(){
			$(this).parent().find("ul.subShare").slideUp('slow'); //When the mouse hovers out of the subShare, move it back up
		});
		//Following events are applied to the trigger (Hover events for the trigger)
		}).hover(function() {
			$(this).addClass("subhover"); //On hover over, add class "subhover"
		}, function(){	//On Hover Out
			$(this).removeClass("subhover"); //On hover out, remove class "subhover"
	});
});
</script>

el css:

Código:

ul.topShare {
    display: table;
    float: left;
    list-style: none outside none;
    margin: 0;
    padding: 5px;
}
ul.topShare li {
    float: left;
    /*height: 30px;*/
    margin: 0;
    padding: 0;
    position: relative;
}
ul.topShare li a {
    /*color: #FFFFFF;*/
    display: block;
    float: left;
    /*height: 30px;*/
    text-decoration: none;
}
ul.topShare li a:hover {
}
ul.topShare li .subhover {
    cursor: pointer;
}
ul.topShare li ul.subShare {
    background: none repeat scroll 0 0 #ffffff;
	border-radius: 15px 15px 15px 15px ;
	-moz-border-radius:15px 15px 15px 15px ;
	-webkit-border-radius: 15px 15px 15px 15px ;
	-o-border-radius: 15px 15px 15px 15px ;
	border: thin solid #007FFF;
    display: none;
    float: left;
    left: 0;
    list-style: none outside none;
    margin: 10px;
    padding: 5px;
    position: absolute;
    top: 15px;
    width: 141px;
    z-index: 1000;
}
ul.topShare li ul.subShare li {
    clear: both;
    margin: 0;
    padding: 0;
    width: 150px;
    z-index: 1000;
}
html ul.topShare li ul.subShare li a {
   /*
   background: url("dropdown_linkbg.gif") no-repeat scroll 10px center #487B1E;
    float: left;
    padding-left: 20px;
    width: 180px;
    */
}
html ul.topShare li ul.subShare li a:hover {
    background: url("dropdown_linkbg.gif") no-repeat scroll 10px center #ADE187;
    color: #487B1E;
}

Y por último la "caja" con el botón:

Código HTML:

<div>Compartir: <b>&quot;Últimos fanarts de jugadorx en FanArt&quot;</b> 
<ul class="topShare">
	<li><a href="#null">[compartir]</a>
		<ul class="subShare">
			<li><div class="fb-like" data-href="http://www.fanart.nippon-tour.com%2Fultimosde%2Fjugadorx%2F55%2F" data-send="false" data-layout="button_count" data-width="121" data-show-faces="false"></div></li>
			<li><a href="https://twitter.com/share" class="twitter-share-button" data-url="http://tinyurl.com/blsgzsk" data-text="" data-lang="es" data-hashtags="">Twittear</a><script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script></li>
			<li><!-- Coloca esta etiqueta donde quieras que se muestre el botón +1. --> <g:plusone size="medium" href="http://www.fanart.nippon-tour.com%2Fultimosde%2Fjugadorx%2F55%2F"></g:plusone></li>
			<li><a href="http://myweb2.search.yahoo.com/myresults/bookmarklet?t=%DAltimos+fanarts+de+jugadorx+en+FanArt&amp;u=http://www.fanart.nippon-tour.com%2Fultimosde%2Fjugadorx%2F55%2F" target="_blank" title="A&ntilde;adir a Yahoo! MyWeb"><img src="http://www.nippon-tour.com/blogs/imagenes/icosBlogs/v2/yahoo_32.png" alt="A&ntilde;adir a Yahoo! MyWeb" vspace="1" hspace="1" align="left"></a></li>
			<li><a href="http://meneame.net/submit.php?url=http://www.fanart.nippon-tour.com%2Fultimosde%2Fjugadorx%2F55%2F" target="_blank" title="A&ntilde;adir a Menéame"><img src="http://www.nippon-tour.com/blogs/imagenes/icosBlogs/v2/meneame_32.png" alt="A&ntilde;adir a Menéame" vspace="1" hspace="1" align="left"></a></li>
		</ul>
	</li>
</ul>
</div> 

El ejemplo está online aquí: http://www.fanart.nippon-tour.com/item/2435/he-vuelto/

Gracias!!!