Pagina 1 di 1

Div che copre menù. Non funzionano più i link

MessaggioInviato: 29 giu 2012, 23:39
da Daniele78
Al seguente menù volevo dare un effetto fadeout sovrapponendovi un div che ha come sfondo un' immagine bianca con delle semitrasparenze.
Ho ottenuto l' effetto grafico desiderato solo che adesso non funzionano più i link e neanche gli eventi IQuery.
Grazie.


Codice: Seleziona tutto

<style type="text/css">

    #ext_menu_div_gradient{
        z-index: 2;
        background:  url(images/bottom-fade.png) bottom left repeat-x;
        align:center;
        width: 15%;                     /* the same of #ext_menu_div*/
        height: 300px;                  /*Height of Menù*/
        margin-top:20px;   
        position: absolute;
    }


    #menu_container{
        align:center;
        width: 100%;
        height: 300px;                  /*Height of Menù*/
        max-height: 300px;              /*Height of Menù*/
        overflow:auto;
    }


</style>

<div id="ext_menu_div_gradient"></div>
<div id="menu_container">
    <div id="menuB">
        <a class="menuitem" href="Home">Home</a>
        <a class="menuitem" href="Conferenze%20ed%20orari">Conferenze ed orari</a>
        <a class="menuitem" href="News">News</a>
        <a class="menuitem" href="Contattaci">Contattaci</a>
        <a class="menuitem submenuheader" href="Aiutaci">Aiutaci</a>
        <div class = "submenu">
            <ul>
                <li><a href = "Dillo%20ai%20tuoi%20amici">Dillo ai tuoi amici</a></li>
                <li><a href = "Inserisci%20banner">Inserisci banner</a></li>
                <li><a href = "Tramite%20Facebook">Tramite Facebook</a></li>
            </ul>
        </div>
        <a class="menuitem" href="Attivit%C3%A0">Attivit&agrave</a>
        <a class="menuitem submenuheader" href="Sponsor">Sponsor</a>
        <div class = "submenu">
            <ul>
                <li><a href = "Diventa%20sponsor">Diventa sponsor</a></li>
                <li><a href = "I%20nostri%20sponsor">I nostri sponsor</a></li>
            </ul>
        </div>
        <a class="menuitem" href="FAQ">FAQ</a>
        <a class="menuitem" href="Segnalazioni">Segnalazioni</a>
        <a class="menuitem" href="Le%20passate%20edizioni">Le passate edizioni</a>
        <a class="menuitem" href="Rassegna%20stampa">Rassegna stampa</a>
        <a class="menuitem" href="Lo%20staff">Lo staff</a>
        <a class="menuitem" href="Video%20conferenze%202011">Video conferenze 2011</a>
        <a class="menuitem" href="Slide">Slide</a>
    </div><!--close <div id="menuB">-->
</div><!--close <div id="menu_container">-->



Re: Div che copre menù. Non funzionano più i link

MessaggioInviato: 30 giu 2012, 11:12
da angus
Avrei un'idea, ma per verificarla vorrei poter vedere il codice completo (o almeno quanto necessario per replicare il problema).
Puoi postarlo? allegando anche le immagini?

Re: Div che copre menù. Non funzionano più i link

MessaggioInviato: 30 giu 2012, 11:27
da Daniele78
Sì. Grazie.

Re: Div che copre menù. Non funzionano più i link

MessaggioInviato: 30 giu 2012, 11:52
da angus
È abbastanza comprensibile che se sopra al menu ci metti 2 div, quello che c'è sotto non sia più cliccabile...

Dovresti agire sui background del contenitore del menu o sulle varie voci, a seconda dell'effetto che vuoi ottenere...
in particolare guarderei il CSS di #menu_container.. ha la proprietà background-color commentata.. se metti un'immagine lì ottieni quello che vuoi?

Re: Div che copre menù. Non funzionano più i link

MessaggioInviato: 30 giu 2012, 15:28
da Daniele78
Perfetto grazie. Non ci avevo pensato.

Re: Div che copre menù. Non funzionano più i link

MessaggioInviato: 20 lug 2012, 23:24
da Daniele78
Ho ancora un problema.
Linkando menu.css in index.html, e usando Firefox, appare attorno alla voce con sottomenù selezionata, un rettangolo tratteggiato che non riesco a rimuovere in alcun modo.
Per le altre voci appare anche ma solo per un istante perché si ha il reindirizzamento.
Grazie!

Re: Div che copre menù. Non funzionano più i link

MessaggioInviato: 21 lug 2012, 11:01
da Daniele78
Ho risolto.

Bisognava aggiungere nel css

#menuB a:active{
outline: 0;
}
#menuB a:focus {
outline: 0;