Converti fisarmonica hover su onclick

Ho un menu di fisarmonica sviluppato con puro css3. Attualmente sta aprendo il menu quando ci si passa sopra ma voglio che venga aperto al clic. Ho raggiunto questo?Converti fisarmonica hover su onclick

Un altro aiuto. Attualmente il contenuto div è nella parte destra dell'intestazione, ma ho bisogno che sia aperto nella parte sinistra.

E il contenuto div dovrebbe avere larghezza automatica in base al contenuto.

Ecco la DEMO

fonte

2012-08-23 Sowmya

tenta di utilizzare: attivo anziché: hover – anderssonola

L'utilizzo di Active sta chiudendo il div di contenuto quando esco dal pulsante del mouse. Voglio che il clic sia attivo – Sowmya

$('h3','.horizontalaccordion ul li').on('click',function() { 
    $(this).closest('li').toggleClass('hover').siblings().removeClass('hover'); 
});

FIDDLE

fonte

2012-08-23 07:30:31 adeneo

Ma quando togli il cursore dal div, il contenuto si sta scappando. Per favore, controlla tat – Sowmya

'.horizontalaccordion> ul> li.hover> div {display: block; } 'invece di' .horizontalaccordion: hover> ul> li.hover> div {display: block; } '- http://jsfiddle.net/thebabydino/a545y/14/ – Ana

@Ana Fantastico !! Sta funzionando. Un ultimo aiuto .. Come faccio a rimuovere il pannello dei contenuti per aprire il lato sinistro ?? – Sowmya

penso che non basta un clic, ma anche vorrebbe chiudere i pannelli aperti in precedenza, quindi si prega di consultare questo codice:

$('h3','.horizontalaccordion ul li').click(function() { 
    $('*[class*=hover]').removeClass('hover'); // close all opened tabs 
    $(this).closest('li').addClass('hover'); // open the currently clicked one 
});

jsFiddle Example

Spero che funzioni per te!

fonte

2012-08-23 07:37:10

funziona ma di nuovo lo stesso problema. espandi un menu estrai il cursore dalla fisarmonica, quindi nasconde il contenuto. Pls chk – Sowmya

Ho appena controllato in Chrome e tutto è liscio? Potresti dirmi qual è il tuo browser? –

Converti fisarmonica hover su onclick

risposta

Problemi correlati