Problemas com o .Hover! "enloquecido".

Bom gente fiz esse codigo funciona direitinho a não ser por um probleminha desagradavel, meu intuito foi fazer um sistema semelhante ao evento que ocorre no menu do Google+. que ao passa mouse o menu não abre, mais sim ao posicionar o mouse em cima o menu abre, não consegui ai toda vez que passo mais de uma vez rapidamente ele repete isso como se estivesse "enloquecido". bem peço ajuda a solucionar, bom o ponto chave é a o evento que ocorre no menu do google +como já expliquei. bom segue o codigo criado.

<script type="text/javascript">
$(document).ready(function(e) {
 var winWidth = $(window).width();
 baron = $('.header_page').width('260px').addClass('letsRight');
 barHead = $('.header_page');
 menuRom = $('.nav-menu').hide();
 var boxSeach = $(".search").val();

 //Abrir o div
 barHead.hover(function(){
 $("#search").show();

 menuRom.show();
 baron.animate({
 "width": "100%",
 "left": "0",
 }, 200, function() {
 });

 },function(){
 $("#search").hide();
 menuRom.hide();
 $(".innerMenu").hide()
 barHead.animate({
 "width":"260px",
 "left": "112px",
 }, 180, function(){

 });

 });
});
</script>