sottomenu all hover su voce contattaci

[manu1289]

salve
al mio menu che viene generato in automatico, volevo aggiungere all'hover su una voce (contattaci) un sottomenu come da allegato.

questo è il menu generato in automatico

<div class="menu-main-menu-container">
        <ul id="menu-main-menu" class="nav-menu">
          <li id="menu-item-85" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-85"><a href="http://miosito.com/services/">Services</a></li>
          <li id="menu-item-86" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-86"><a href="http://miosito.com/work/">Work</a></li>
          <li id="menu-item-82" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-82"><a href="http://miosito.com/blog/">Blog</a></li>
          <li id="menu-item-83" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-83"><a href="http://miosito.com/company/">Company</a></li>
          <li id="menu-item-84" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-84"><a href="http://miosito.com/contact/">Contact</a>
          </li>
        </ul>
      </div>

come dicevo prima, volevo inserire un sottomenu all'hover sulla voce contattaci.
ho provato questo codice ma non riesco tenerlo aperto quando passo nel sottomenu.

var $submenu = $( "<div class='submenu'><div class='menucontact'><ul><li><a href='#' target='_blank'>mail</a></li><li><a href='#' target='_blank'>mail</a></li></ul></div><div class='menusocial'><ul><li><a href='#' target='_blank'>social1</a></li><li><a href='#' target='_blank'>social1</a></li><li><a href='#' target='_blank'>social1</a></li></ul></div></div>" );
$("li#menu-item-84").hover(function() {
$( this ).append( $submenu);
}, function() {
    $( this ).find( ".submenu" ).remove();
}
);

potete aiutarmi?

grrazie

 

[criric]

Ciao, a me funziona. Sei riuscito a risolvere ?

 

[n1k4r0]

ciao, anche a me funziona. l'unica cosa diversa è che ho inserito il tuo javascript dentro a $(function...
in pratica:

$(function() {
    var $submenu = $( "<div class='submenu'><div class='menucontact'><ul><li><a href='#' target='_blank'>mail</a></li><li><a href='#' target='_blank'>mail</a></li></ul></div><div class='menusocial'><ul><li><a href='#' target='_blank'>social1</a></li><li><a href='#' target='_blank'>social1</a></li><li><a href='#' target='_blank'>social1</a></li></ul></div></div>" );
    $("li#menu-item-84").hover(function() {
        $( this ).append( $submenu);
    }, function() {
        $( this ).find( ".submenu" ).remove();
    }
    );
});

però per il resto è identico e funziona alla perfezione.