sottomenu all hover su voce contattaci

manu1289

Nuovo Utente
19 Giu 2015
3
0
0
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
HTML:
<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.

HTML:
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
 

Allegati

  • Senza-titolo-1.jpg
    Senza-titolo-1.jpg
    19,8 KB · Visite: 316

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Ciao, a me funziona. Sei riuscito a risolvere ?
 

n1k4r0

Utente Attivo
15 Nov 2012
135
0
0
ciao, anche a me funziona. l'unica cosa diversa è che ho inserito il tuo javascript dentro a $(function...
in pratica:

Codice:
$(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.
 
Discussioni simili
Autore Titolo Forum Risposte Data
P Effetto a:hover sempre attivo solo se si và su una voce del sottomenu HTML e CSS 1
L mettere un simbolo per capire se è un sottomenu jQuery 2
R sottomenu a tendina resta fisso HTML e CSS 2
O Problema Sottomenu HTML e CSS 2
asevenx Gestire posizionamento voci sottomenu che si nascondono HTML e CSS 1
D mostrare nascondere sottomenu Javascript 1
M sottomenu stessa altezza di menu con voce attiva evidenziata Javascript 3
E [Menu JQuery]: problema click quando il sottomenu si apre sopra un iframe... jQuery 0
S Perchè i sottomenu non si vedono? HTML e CSS 3
M Aggiungere sei sottomenu ad un menu mootools Javascript 0
S Menu e sottomenu client side senza reload della pagina Javascript 1
P modifica colore A Hover link website . WordPress 2
amaranthinemess [HTML] :target e :hover HTML e CSS 5
Giacomo Boccherini [Javascript] [HTML] Hover Javascript 1
Andrea_Ventura [HTML] Problemi con effetto hover HTML e CSS 5
Sermatth72 [HTML] creare link con colori Hover diversi, possibile? HTML e CSS 6
U Hover su immagine escluso titolo - flexbox Presentati al Forum 0
U [HTML] Hover su immagine escluso titolo - flexbox HTML e CSS 3
S [HTML] Effetto hover in un div HTML e CSS 6
otto9due Lampeggiamento solo su .hover(), inizia ma non riesco a fermarlo! jQuery 2
otto9due .hover() perchè non va in questo caso? jQuery 2
greven [WordPress] [CSS3] Inserire Hover Effect sul menù WordPress 10
Papalla CSS3 - immagine di sfondo con elementi che appaiono col mouse hover HTML e CSS 4
F Problema hover voce di menù Javascript 2
A :hover HTML e CSS 5
A Simulazione :hover su touch device Javascript 1
P Hover HTML e CSS 1
Shyson jQuery, togliere css hover jQuery 1
L Effetto hover con jquery jQuery 2
F mappa jquery con effetto hover + fancybox Javascript 1
F Come si chiama questo effetto hover? Javascript 1
H Problema hover img jQuery 6
M [RISOLTO] Problema con 'a:hover' HTML e CSS 12
Shyson Mettere hover a css in linea HTML e CSS 1
A Stato di :hover su dispositivi Touch-Screen HTML e CSS 6
P Problema con hover div jQuery 2
A hover impostare bordo HTML e CSS 9
Dexter_90 [AIUTO] Modificare proprieta Css tramite hover con Javascript Javascript 4
Dexter_90 [AIUTO] Modificare proprieta Css tramite hover HTML e CSS 4
S strano comportamento a:hover su immagine HTML e CSS 7
andre9004 Dropdown menu con .hover() jQuery 2
D Eventi: si possono modificare proprietà css di un el. B tramite un hover su un el. A? HTML e CSS 0
S [JQUERY] immagine che resta attiva all'hover jQuery 4
S Usare l'hover jQuery 4
F Arrotondare angoli hover HTML e CSS 3
D attivazione dei suoni all'hover in jQuery jQuery 0
voldemort jquery: live con hover jQuery 1
M Come utilizzare :hover senza documento .css HTML e CSS 4
davide1982 Problema animazione con animate e hover Javascript 4
I CSS - hover HTML e CSS 3

Discussioni simili