• User

    menù a tendina impazzito

    Ciao a tutti!
    Sono streghetta ho un problema con un menù a tendina scaricato da html.it in javascript perché mentre con IE tutto ok con mozilla non solo non è più posizionato centralmente ma non ha più la forma di menù a tendina inquanto tutte le voci sono già aperte e inutilizzabili
    Come posso fare per utilizzare il menù sia con IE che con mozilla?
    Qualcuno potrebbe aiutarmi?


  • User Attivo

    Ho già dovuto affrontare quest'orribile problema...

    Dovrai avere 2 script distinti per i 2 browser...

    O posti il tuo, e vediamo come modificarlo...o appena ritrovo uno che avevo fatto un po di tempo fa...te lo posto io...


  • User Attivo

    Ecco qui, li ho trovati....

    Firefox:

    
    <style>
    .menuNavigazione
    {
        margin: 0;
        padding:0;
        list-style:none;
        height:2em;
        border: 1px solid #000;
    }
    .menuNavigazione li
    {
        float:left;
        position:relative;
        /*display:inline;*/
    }
    .menuNavigazione a
    {
        float:left;
        height:2em;/*height:0em;*//*height:2em;*/
        line-height:2em;
        padding:0 0.7em;
        text-decoration:none;
        border-right:1px solid;
        white-space:nowrap;
    }
    
    .menuNavigazione ul
    {
        margin:0;
        padding:0;
        list-style:none;
        width:17em;
    }
    .menuNavigazione ul li
    {
        float:none;
    }
    .menuNavigazione ul a
    {
        float:none;
        display:block;
        height:1.8em;
        line-height:1.8em;
        border-right:1px solid;
        border-left:1px solid;
        border-bottom:1px solid;
        white-space: normal;
    }
    
    .menuNavigazione ul, menuNavigazioneul.subMenu-off
    {
        position:absolute;
        visibility:hidden;
    }
    .menuNavigazione ul.subMenu-on
    {
        visibility:visible;
    }
    .menuNavigazione ul.subMenu-on
    {
        position:absolute;
        top:2em;
        left:-1px;
        visibility:visible;
        border-top:1px solid;
    }
    .menuNavigazione ul.subMenu-on ul.subMenu-on
    {
        margin: 0 0 0 -1px;
        width: 17em;
        position:absolute;
        top:-1px;
        left:17em;
        border-top: 1px solid;
    }
    
    .menuNavigazione
    {
        background: #eee;
        color:;
    }
    .menuNavigazione a
    {
        background:#EEE;
        color:#000;
    }
    
    .menuNavigazione a:hover, .menuNavigazione a:focus, .menuNavigazione a:active
    {
        background:#33FF66;
    }
    .menuNavigazione a.continua
    {
        background:url() #EEE right center no-repeat;
    }
    .menuNavigazione ul.continua
    {
        background:url() #EEE right center no-repeat;
    }
    </style>
    <script>
    menuClassName = "menuNavigazione";
    
    function closeSub(menu)
    {
        for(var i=0; i<menu.childNodes.length; i++)
        {
            if(menu.childNodes*.nodeName.toLowerCase()=="li")
            {
                li = menu.childNodes*;
                li.onmouseover = li.onactivete = li.onfocus = function(){if(this.subMenu)this.subMenu.className = this.subMenu.className.replace(/subMenu-off/g,"subMenu-on")};
                li.onmouseout = li.ondeactivate = li.onblur = function(){if(this.subMenu) closeSub(this.subMenu)};
                for(j=0; j<li.childNodes.length; j++)
                {
                    if(li.childNodes[j].nodeName.toLowerCase()=="ul" || li.childNodes[j].nodeName.toLowerCase()=="ol")
                    {
                        closeSub(li.subMenu = li.childNodes[j]);
                    }
                }
            }
        }
        menu.className = menu.className.replace(/\s?subMenu-on/g,"")+" subMenu-off";
    }
    
    window.onload = function(e){
        if(tags_ = document.getElementsByTagName('ul'))
        {
            for(i=0; i<tags_.length; i++)
            {
                if(tags_*.className==menuClassName)
                {
                    closeSub(tags_*);
                }
                
            }
        }
        if(tags_ = document.getElementsByTagName('ol'))
        {
            for(i=0; i<tags_.length; i++)
            {
                if(tags_*.className==menuClassName)
                {
                    closeSub(tags_*);
                }
                
            }
        }
    }
    </script>
    
    <ul class="menuNavigazione">
        <li><a href="#">Prima voce</a></li>
        <li><a href="#" class="continua">Seconda voce</a>
            <ul>
                <li><a href="#">Prima sottovoce</a></li>
                <li><a href="#" class="continua">Seconda sottovoce</a>
                    <ul>
                        <li><a href="#">1 sottovoce</a></li>
                        <li><a href="#">2 sottovoce</a></li>
                        <li><a href="#">3 sottovoce</a></li>
                    </ul>
                </li>
                <li><a href="#">Terza sottovoce</a></li>
            </ul>
        </li>
        <li><a href="#" class="continua">Terza voce</a>
            <ul>
                <li><a href="#">Prima sottovoce</a></li>
                <li><a href="#">Seconda sottovoce</a></li>
                <li><a href="#">Terza sottovoce</a></li>
            </ul>
        </li>
        <li><a href="#">Quarta voce</a></li>
        <li><a href="#">Quinta voce</a></li>
    </ul>
    
    ```Internet Explorer:
    

    <style>
    .menuNavigazione
    {
    margin: 0;
    padding:0;
    list-style:none;
    height:2em;
    border: 1px solid;
    }
    .menuNavigazione li
    {
    float:left;
    position:relative;
    display:inline;
    }
    .menuNavigazione a
    {
    float:left;
    height:0em;/height:2em;/
    line-height:2em;
    padding:0 0.7em;
    text-decoration:none;
    border-right:1px solid;
    white-space:nowrap;
    }

    .menuNavigazione ul
    {
    margin:0;
    padding:0;
    list-style:none;
    width:17em;
    }
    .menuNavigazione ul li
    {
    float:none;
    }
    .menuNavigazione ul a
    {
    float:none;
    display:block;
    height:1.8em;
    line-height:1.8em;
    border-right:1px solid;
    border-left:1px solid;
    border-bottom:1px solid;
    white-space: normal;
    }

    .menuNavigazione ul, menuNavigazioneul.subMenu-off
    {
    position:absolute;
    visibility:hidden;
    }
    .menuNavigazione ul.subMenu-on
    {
    visibility:visible;
    }
    .menuNavigazione ul.subMenu-on
    {
    position:absolute;
    top:2em;
    left:-1px;
    visibility:visible;
    border-top:1px solid;
    }
    .menuNavigazione ul.subMenu-on ul.subMenu-on
    {
    margin: 0 0 0 -1px;
    width: 17em;
    position:absolute;
    top:-1px;
    left:17em;
    border-top: 1px solid;
    }

    .menuNavigazione
    {
    background:;
    color:;
    }
    .menuNavigazione a
    {
    background:#EEE;
    color:#000;
    }

    .menuNavigazione a:hover, .menuNavigazione a:focus, .menuNavigazione a:active
    {
    background:#33FF66;
    }
    .menuNavigazione a.continua
    {
    background:url() #EEE right center no-repeat;
    }
    .menuNavigazione ul.continua
    {
    background:url() #EEE right center no-repeat;
    }
    </style>
    <script>
    menuClassName = "menuNavigazione";

    function closeSub(menu)
    {
    for(var i=0; i<menu.childNodes.length; i++)
    {
    if(menu.childNodes*.nodeName.toLowerCase()=="li")
    {
    li = menu.childNodes*;
    li.onmouseover = li.onactivete = li.onfocus = function(){if(this.subMenu)this.subMenu.className = this.subMenu.className.replace(/subMenu-off/g,"subMenu-on")};
    li.onmouseout = li.ondeactivate = li.onblur = function(){if(this.subMenu) closeSub(this.subMenu)};
    for(j=0; j<li.childNodes.length; j++)
    {
    if(li.childNodes[j].nodeName.toLowerCase()=="ul" || li.childNodes[j].nodeName.toLowerCase()=="ol")
    {
    closeSub(li.subMenu = li.childNodes[j]);
    }
    }
    }
    }
    menu.className = menu.className.replace(/\s?subMenu-on/g,"")+" subMenu-off";
    }

    window.onload = function(e){
    if(tags_ = document.getElementsByTagName('ul'))
    {
    for(i=0; i<tags_.length; i++)
    {
    if(tags_.className==menuClassName)
    {
    closeSub(tags_
    );
    }

        }
    }
    if(tags_ = document.getElementsByTagName('ol'))
    {
        for(i=0; i<tags_.length; i++)
        {
            if(tags_*.className==menuClassName)
            {
                closeSub(tags_*);
            }
            
        }
    }
    

    }
    </script>

    <ul class="menuNavigazione">
    <li><a href="#">Prima voce</a></li>
    <li><a href="#" class="continua">Seconda voce</a>
    <ul>
    <li><a href="#">Prima sottovoce</a></li>
    <li><a href="#" class="continua">Seconda sottovoce</a>
    <ul>
    <li><a href="#">1 sottovoce</a></li>
    <li><a href="#">2 sottovoce</a></li>
    <li><a href="#">3 sottovoce</a></li>
    </ul>
    </li>
    <li><a href="#">Terza sottovoce</a></li>
    </ul>
    </li>
    <li><a href="#" class="continua">Terza voce</a>
    <ul>
    <li><a href="#">Prima sottovoce</a></li>
    <li><a href="#">Seconda sottovoce</a></li>
    <li><a href="#">Terza sottovoce</a></li>
    </ul>
    </li>
    <li><a href="#">Quarta voce</a></li>
    <li><a href="#">Quinta voce</a></li>
    </ul>


  • User

    Ciao Digital Daigor!
    Posso dirti con tutto il cuore che sei meravigliosamente fantastico?!
    Ho appena copiato il tuo programma, ma adesso sono a lavoro e non posso provarlo subito. Appena lo provo ti so dire se sei il mio cavaliere dall'armatura scintillante che mi toglie da un brutto impiccio (anche se sono una streghetta ........beh rivoluzioniamo le fiabe dai!).
    In ogni caso grazie mille ti faccio sapere presto.
    Un bacione da streghetta💋


  • User Attivo

    Dovere mia cara...
    Quando vedo una gentil pulzella in difficoltà, mi prodigo per superare qualsiasi avversità, e portare al sicuro le creature più fragili e indifese!

    Hahahaah!

    Se ti serve ti posto anche la versione in verticale...non si sa mai...

    Ciao!


  • User Attivo

    Versione verticale:

    Firefox:

    
    <style>
    /* multi menu
    id 1: 123;
    id 2: 234;
    
     */
    /* MENU */
    .menuNavigazione_123
    {
        margin:0;
        padding:0;
        width:200px;
        list-style:none;
        border-top: 1px solid;
    }
    .menuNavigazione_123 li
    {
        position:relative;
    }
    /* SOTTO MENU */
    .menuNavigazione_123 ul
    {
        list-style:none;
        padding:0;
        border-top:1px solid;
    }
    /*SOTTO MENU SENZA JS*/
    .memuNavigazione_123 ul
    {
        margin:0 0 0 10px;
    }
    /*SOTTO MENU CON JS: ON OFF*/
    .menuNavigazione_123 ul.subMenu-off
    {
        position:absolute;
        visibility:hidden;
        height:0;
        overflow:hidden;
    }
    .menuNavigazione_123 ul.subMenu-on
    {
        margin:0;
        width:200px;
        position:absolute;
        top:-1px;
        /*overflow:hidden;*/
        left:199px;
        visibility:visible;
    }
    /* COLEGAMENTI */
    .menuNavigazione_123 a
    {
        display:block;
        text-decoration:none;
        padding: 2px 10px;
    }
    .menuNavigazione_123 a
    {
        border-right: 1px solid #000;
        border-bottom: 1px solid;
        border-left: 1px solid;
    }
    
    /* COLORI */
    .menuNavigazione_123 a:link, .menuNavigazione_123 a:visited
    {
    
    }
    .menuNavigazione_123 a:hover, .menuNavigazione_123 a:focus, .menuNavigazione_123 a:active
    {
    
    }
    /* VOCI CON SOTTO MENU */
    .menuNavigazione_123.subMenu-on a.continua:link, .menuNavigazione_123.subMenu-on a.continua:visited,.menuNavigazione_123.subMenu-off a.continua:link, .menuNavigazione_123.subMenu-off a.continua:visited
    {
        background-image: url();
        background-position: right center;
        background-repeat:no-repeat;
    }
    
    
    
    
    /* MENU */
    .menuNavigazione_234
    {
        margin:0;
        padding:0;
        width:200px;
        list-style:none;
        border-top: 1px solid;
    }
    .menuNavigazione_234 li
    {
        position:relative;
    }
    /* SOTTO MENU */
    .menuNavigazione_234 ul
    {
        list-style:none;
        padding:0;
        border-top:1px solid;
    }
    /*SOTTO MENU SENZA JS*/
    .memuNavigazione_234 ul
    {
        margin:0 0 0 10px;
    }
    /*SOTTO MENU CON JS: ON OFF*/
    .menuNavigazione_234 ul.subMenu-off
    {
        position:absolute;
        visibility:hidden;
        height:0;
        overflow:hidden;
    }
    .menuNavigazione_234 ul.subMenu-on
    {
        margin:0;
        width:200px;
        position:absolute;
        top:-1px;
        /*overflow:hidden;*/
        left:199px;
        visibility:visible;
    }
    /* COLEGAMENTI */
    .menuNavigazione_234 a
    {
        display:block;
        text-decoration:none;
        padding: 2px 10px;
    }
    .menuNavigazione_234 a
    {
        border-right: 1px solid;
        border-bottom: 1px solid;
        border-left: 1px solid;
    }
    
    /* COLORI */
    .menuNavigazione_234 a:link, .menuNavigazione_234 a:visited
    {
        
        
    }
    .menuNavigazione_234 a:hover, .menuNavigazione_234 a:focus, .menuNavigazione_234 a:active
    {
        
        
    }
    /* VOCI CON SOTTO MENU */
    .menuNavigazione_234.subMenu-on a.continua:link, .menuNavigazione_234.subMenu-on a.continua:visited,.menuNavigazione_234.subMenu-off a.continua:link, .menuNavigazione_234.subMenu-off a.continua:visited
    {
        background-image: url();
        background-position: right center;
        background-repeat:no-repeat;
    }
    
    .secliv
    {
        background: #0033CC;
    }
    .terliv
    {
        background: #FFFF00;
    }
    .bottone_1
    {
        background-color:#666666;
    }
    .bottone_1_over
    {
        background-color:#FF9900;
    }
    .testo_1
    {
        color:#FF9900;
    }
    .testo_1_over
    {
        color:#000000;
    }
    </style>
    <script>
    function closeSub(menu)
    {
        for(var i=0; i<menu.childNodes.length; i++)
        {
            if(menu.childNodes*.nodeName.toLowerCase()=="li")
            {
                li = menu.childNodes*;
                li.onmouseover = li.onactivete = li.onfocus = function(){if(this.subMenu)this.subMenu.className = this.subMenu.className.replace(/subMenu-off/g,"subMenu-on")};
                li.onmouseout = li.ondeactivate = li.onblur = function(){if(this.subMenu) closeSub(this.subMenu)};
                for(j=0; j<li.childNodes.length; j++)
                {
                    if(li.childNodes[j].nodeName.toLowerCase()=="ul" || li.childNodes[j].nodeName.toLowerCase()=="ol")
                    {
                        closeSub(li.subMenu = li.childNodes[j]);
                    }
                }
            }
        }
        menu.className = menu.className.replace(/\s?subMenu-on/g,"")+" subMenu-off";
    }
    
    function inizializza_menu(menuName)
    {
        menuClassName = menuName;
        
        if(tags_ = document.getElementsByTagName('ul'))
        {
            for(i=0; i<tags_.length; i++)
            {
                if(tags_*.className==menuClassName)
                {
                    closeSub(tags_*);
                }
            }
        }
        if(tags_ = document.getElementsByTagName('ol'))
        {
            for(i=0; i<tags_.length; i++)
            {
                if(tags_*.className==menuClassName)
                {
                    closeSub(tags_*);
                }
            }
        }
    }
    
    window.onload = function(e)
    {
         inizializza_menu('menuNavigazione_123');
         inizializza_menu('menuNavigazione_234');
    }
    
    function stile(id_sfondo,stile_new_sfondo,id_testo,stile_new_testo)
    {
        document.getElementById(id_sfondo).className = stile_new_sfondo;
        document.getElementById(id_testo).className = stile_new_testo;
    }
    </script>
    
    <ul class="menuNavigazione_123">
        <li><table class="bottone_1" id="bottone_prima_voce"><tr><td onMouseOver="stile('bottone_prima_voce','bottone_1_over','testo_prima_voce','testo_1_over');" onMouseOut="stile('bottone_prima_voce','bottone_1','testo_prima_voce','testo_1');"><a href="#"><font id="testo_prima_voce" class="testo_1">Prima voce</font></a></td></tr></table></li>
        <li><a href="#" class="continua">Seconda voce</a>
            <ul>
                <li><a href="#" class="secliv">Prima sottovoce</a></li>
                <li><a href="#" class="continua secliv">Seconda sottovoce</a>
                    <ul>
                        <li><a href="#" class="tercliv">1 sottovoce</a></li>
                        <li><a href="#" class="tercliv">2 sottovoce</a></li>
                        <li><a href="#" class="tercliv">3 sottovoce</a></li>
                    </ul>
                </li>
                <li><a href="#">Terza sottovoce</a></li>
            </ul>
        </li>
        <li><a href="#" class="continua">Terza voce</a>
            <ul>
                <li><a href="#">Prima sottovoce</a></li>
                <li><a href="#">Seconda sottovoce</a></li>
                <li><a href="#">Terza sottovoce</a></li>
            </ul>
        </li>
        <li><a href="#">Quarta voce</a></li>
        <li><a href="#">Quinta voce</a></li>
    </ul>
    
    
    <ul class="menuNavigazione_234">
        <li><a href="#">Prima voce</a></li>
        <li><a href="#" class="continua">Seconda voce</a>
            <ul>
                <li><a href="#" class="secliv">Prima sottovoce</a></li>
                <li><a href="#" class="continua secliv">Seconda sottovoce</a>
                    <ul>
                        <li><a href="#" class="terliv">1 sottovoce</a></li>
                        <li><a href="#" class="terliv">2 sottovoce</a></li>
                        <li><a href="#" class="terliv">3 sottovoce</a></li>
                    </ul>
                </li>
                <li><a href="#" class="secliv">Terza sottovoce</a></li>
            </ul>
        </li>
        <li><a href="#" class="continua">Terza voce</a>
            <ul>
                <li><a href="#">Prima sottovoce</a></li>
                <li><a href="#">Seconda sottovoce</a></li>
                <li><a href="#">Terza sottovoce</a></li>
            </ul>
        </li>
        <li><a href="#">Quarta voce</a></li>
        <li><a href="#">Quinta voce</a></li>
    </ul>
    
    ```Internet Explorer:
    

    <style>
    /* MENU /
    .menuNavigazione
    {
    margin:0px;
    padding:0px;
    width:200px;
    list-style:none;
    border-top: 1px solid;
    }
    .menuNavigazione li
    {
    position:relative;
    padding:0px;
    display:inline
    }
    /
    SOTTO MENU /
    .menuNavigazione ul
    {
    list-style:none;
    padding:0px;
    border-top:1px solid;
    }
    /SOTTO MENU SENZA JS/
    .memuNavigazione ul
    {
    margin:0px 0px 0px 10px;
    }
    /SOTTO MENU CON JS: ON OFF/
    .menuNavigazione ul.subMenu-off
    {
    position:absolute;
    visibility:hidden;
    height:0px;
    overflow:hidden;
    }
    .menuNavigazione ul.subMenu-on
    {
    margin:0px;
    width:200px;
    position:absolute;
    top:-1px;
    /overflow:hidden;/
    left:199px;
    visibility:visible;
    }
    /
    COLEGAMENTI /
    .menuNavigazione a
    {
    display:block;
    text-decoration:none;
    padding: 2px 10px;
    height:0px;
    }
    .menuNavigazione a
    {
    border-right: 1px solid;
    border-bottom: 1px solid;
    border-left: 1px solid;
    }
    /
    COLORI */
    .menuNavigazione a:link, .menuNavigazione a:visited
    {

    }
    .menuNavigazione a:hover, .menuNavigazione a:focus, .menuNavigazione a:active
    {

    }
    /* VOCI CON SOTTO MENU */
    .menuNavigazione.subMenu-on a.continua:link, .menuNavigazione.subMenu-on a.continua:visited,.menuNavigazione.subMenu-off a.continua:link, .menuNavigazione.subMenu-off a.continua:visited
    {
    background-image: url();
    background-position: right center;
    background-repeat:no-repeat;
    }

    .bottone_1
    {
    background-color:#666666;
    }
    .bottone_1_over
    {
    background-color:#FF9900;
    }
    .testo_1
    {
    color:#FF9900;
    }
    .testo_1_over
    {
    color:#000000;
    }
    </style>
    <script>
    menuClassName = "menuNavigazione";

    function closeSub(menu)
    {
    for(var i=0; i<menu.childNodes.length; i++)
    {
    if(menu.childNodes*.nodeName.toLowerCase()=="li")
    {
    li = menu.childNodes*;
    li.onmouseover = li.onactivete = li.onfocus = function(){if(this.subMenu)this.subMenu.className = this.subMenu.className.replace(/subMenu-off/g,"subMenu-on")};
    li.onmouseout = li.ondeactivate = li.onblur = function(){if(this.subMenu) closeSub(this.subMenu)};
    for(j=0; j<li.childNodes.length; j++)
    {
    if(li.childNodes[j].nodeName.toLowerCase()=="ul" || li.childNodes[j].nodeName.toLowerCase()=="ol")
    {
    closeSub(li.subMenu = li.childNodes[j]);
    }
    }
    }
    }
    menu.className = menu.className.replace(/\s?subMenu-on/g,"")+" subMenu-off";
    }

    function inizializza_menu(menuName)
    {
    menuClassName = menuName;

    if(tags_ = document.getElementsByTagName('ul'))
    {
        for(i=0; i<tags_.length; i++)
        {
            if(tags_*.className==menuClassName)
            {
                closeSub(tags_*);
            }
        }
    }
    if(tags_ = document.getElementsByTagName('ol'))
    {
        for(i=0; i<tags_.length; i++)
        {
            if(tags_*.className==menuClassName)
            {
                closeSub(tags_*);
            }
        }
    }
    

    }

    window.onload = function(e)
    {
    inizializza_menu('menuNavigazione');
    }

    function stile(id_sfondo,stile_new_sfondo,id_testo,stile_new_testo)
    {
    document.getElementById(id_sfondo).className = stile_new_sfondo;
    document.getElementById(id_testo).className = stile_new_testo;
    }

    </script>

    <ul class="menuNavigazione">
    <li><table class="bottone_1" cellpadding="0" cellspacing="0" border="0" width="200" id="b_1"><tr><td onMouseOver="stile('b_1','bottone_1_over','t_1','testo_1_over');" onMouseOut="stile('b_1','bottone_1','t_1','testo_1');"><a href="#"> <font id="t_1" class="testo_1">Prima voce</font></a></td></tr></table></li>
    <li><table class="bottone_1" cellpadding="0" cellspacing="0" border="0" width="200" id="b_2"><tr><td onMouseOver="stile('b_2','bottone_1_over','t_2','testo_1_over');" onMouseOut="stile('b_2','bottone_1','t_2','testo_1');"><a href="#"><font id="t_2" class="testo_1">Seconda voce</font></a></td></tr></table></a>
    <ul>
    <li><a href="#">Prima sottovoce</a></li>
    <li><a href="#" class="continua">Seconda sottovoce</a>
    <ul>
    <li><a href="#">1 sottovoce</a></li>
    <li><a href="#">2 sottovoce</a></li>
    <li><a href="#">3 sottovoce</a></li>
    </ul>
    </li>
    <li><a href="#">Terza sottovoce</a></li>
    </ul>
    </li>
    <li><a href="#" class="continua">Terza voce</a>
    <ul>
    <li><a href="#">Prima sottovoce</a></li>
    <li><a href="#">Seconda sottovoce</a></li>
    <li><a href="#">Terza sottovoce</a></li>
    </ul>
    </li>
    <li><a href="#">Quarta voce</a></li>
    <li><a href="#">Quinta voce</a></li>
    </ul>

    Ciao!

  • User

    Ciao Digital Daigor!

    😢@Digital Daigor said:

    Versione verticale:

    Firefox e IE
    😢😢😢
    Non funzionano..............................😢dove sbaglio, ho copiato il codice e ho utilizzato l'estensione js, l'ho incorporato nel mio file php (che per come lo uso io è = html) e il risultato è stato di 2 lunghe barre con a sinistra dei scarabocchi tutti ammucchiati uno su l'altro, però il solo sottomenù che si apre è perfetto.
    Cosa faccio?!
    un menù di navigazione orizzontale mi serve ........, non credevo fosse così difficile........Il sito attualmente non è in rete ma se lo metto in rete chi usa firefox lo vede così male? o è il mio pc?


  • User Attivo

    Molto strano, io li ho copiati e provati orora entrambi...e mi funzionano correttamente...

    Quale dei 2 tipi hai preso?

    Per ogni uno dei due, certicale o orizzontale, devi includere css e js differenti per explorer e firefox...


  • User

    Ho provato quello orizzontale ma .......da perfetta "carabiniera" (senza offesa per i carabinieri) ho messo tutto in un unico file js....più tardi provo di nuovo e ti faccio sapere.
    ......................Che vergogna !!!!
    Come faccio in html ha dirgli di usare o uno o l'altro!
    Me lo spieghi.
    Hai presente un pomodoro rosso? beh in confronto a me, in questo momento, è pallidissimo.


  • User Attivo

    Allora, vediamo un po....

    Per sniffare il browser in JS si fa così:

    
    user_bro = navigator.userAgent;
    if(user_bro.indexOf('Firefox')!==-1)
    {
        bro = "ff";
    }
    else if(user_bro.indexOf('MSIE')!==-1)
    {
        bro = "ie";
    }
    else
    {
        bro = "ff";
    }
    
    alert(bro);
    
    

    In pratica questo codice, prende l'user agend del browser, vede se al'interno c'è la stringa identificativa di Firefox o IE, e passa una variabile, dopo esegui o una o l'alta parte di codice...

    Sapendo che usi il php, direi però che ti convenga usare quello per sniffarlo, ed includere solo una parte del codice, così da alleggerire la pagina, anche se non di molto, nel caricamento...

    Per il php:
    [php]
    $bro = $_SERVER['HTTP_USER_AGENT'];

    if(strpos($bro,"Firefox")!==false)
    {
    echo "<script src='tua_pagina_per_firefox.js'></scripr>";
    }
    else if(strpos($bro,"MSIE")!==false)
    {
    echo "<script src='tua_pagina_per_ie.js'></scripr>";
    }
    else
    {
    echo "<script src='tua_pagina_per_firefox.js'></scripr>";
    }
    [/php]


  • User

    Ciao!
    Spero che non hai pensato che sono così maleducata da non risponderti più, il fatto è che provo da diversi giorni e non funziona non compare nulla. Ho un piccolo sospetto ......(scusa l'ignoranza) firefox e mozilla sono due cose diverse vero? attualmente sto optando per un menù a base di ostriche ed aragoste reali, scherzo :wink3: sto pensando a un menù realizzato in css, appena lo provo e se funziona ti faccio sapere.
    Un bacione by streghetta 💋


  • User Attivo

    Mi spiace che lo script non abbia funzionato, sopratutto perchè l'ho copiato pari-pari dalle pagine di test che avevo io...


  • User

    Non importa, sicuramente ho sbagliato qualcosa. In questi giorni, appena trovo un po' di tempo, farò altri tentativi e poi ti faccio sapere. Comunque resti sempre il mio cavaliere dall'armatura scintillante.
    Un bacione


  • User

    @Digital Daigor said:

    Mi spiace che lo script non abbia funzionato, sopratutto perchè l'ho copiato pari-pari dalle pagine di test che avevo io...
    Ciao Digital Daigor o come da me ribattezzato il Cavaliere dall'armatura scintillante.
    Non sò dove sbagliavo ma adesso il tuo menù orizzontale funziona benissimo e lasciami dire che sei un vero genio del male. E' fantastico, funziona benissimo con firefox e ie. Ti ringrazio tantissimo mi hai risolto un grosso problema. Ora vorrei provare a personalizzarlo cioé mi serve una barra più corta e centrale e mettere uno sfondo creato da me in jpg.
    Un grosso anzi grossissimo bacione al mio EROE.


  • User

    Ciao
    E' da un paio di giorni che ci provo ma non riesco ad accorciarla ed a mettere un'immagine di sfondo mia per creare un bottone.
    Aggiungo background-image: url ....ma non cambia nulla idem per le dimensioni e il posizionamento centrale attualmente e troppo lungo perché mi servono solo 4 voci per il menù. Cosa devo fare?!
    Un bacione
    :makeup:💋


  • User Attivo

    Scusa, ma per capire meglio, potresti postare il codice che stai usando, così da fare ipotesi su quello corretto...senò mi sconfusiono!


  • User

    @Digital Daigor said:

    Scusa, ma per capire meglio, potresti postare il codice che stai usando, così da fare ipotesi su quello corretto...senò mi sconfusiono!
    Ciao scusa il ritardo....ma sai le donne per buona regola si fanno aspettare.
    Scherzavo, in verità ho cercato di risolvere da sola per non fare la parte della sciocchina, per lo più o risolto sono riuscita: ad accentrare(non è accentrato al 100%, ma lo sappiamo solo io, tu e chi legge il messaggio), modificare le dimensioni della barra(non ho più una barra lungo tutta la larghezza della pagina), sono riuscita a posizionare un'immagine che mi fà da bottone, ma ho ancora un problema.
    Non riesco a dare ai pulsanti del menù principale la stessa dimensione.
    Il codice che ti posto è il tuo per il menù orizzontale (non mi chiedere qual'è fra quelli che mi hai postato perché non mi ricordo, so solo che funziona sia in IE che firefox)
    Codice:

    
    <head>
    <style>
    .menuNavigazione
    {
    margin: 0;
    padding:0;
    list-style:none;
    height:2em;
    
    width:400px;
    }
    .menuNavigazione li
    {
    float:left;
    position:relative;
    /*display:inline;*/
    }
    .menuNavigazione a
    {
    float:left;
    height:2em;/*height:0em;*//*height:2em;*/
    line-height:2em;
    padding:0 0.7em;
    text-decoration:none;
    border:1px solid #9798FF;
    
    white-space:nowrap;
    }
    
    .menuNavigazione ul
    {
    margin:0;
    padding:0;
    list-style:none;
    width:17em;
    }
    .menuNavigazione ul li
    {
    float:none;
    }
    .menuNavigazione ul a
    {
    float:none;
    display:block;
    height:1.8em;
    line-height:1.8em;
    white-space: normal;
    }
    
    .menuNavigazione ul, menuNavigazioneul.subMenu-off
    {
    position:absolute;
    visibility:hidden;
    }
    .menuNavigazione ul.subMenu-on
    {
    visibility:visible;
    }
    .menuNavigazione ul.subMenu-on
    {
    position:absolute;
    top:2em;
    left:-1px;
    visibility:visible;
    
    }
    .menuNavigazione ul.subMenu-on ul.subMenu-on
    {
    margin: 0 0 0 -1px;
    width: 17em;
    position:absolute;
    top:-1px;
    left:17em;
    
    }
    
    .menuNavigazione
    { background: url(img/logo/xxxx.jpg);
    background: #FFFFFF;
    color: blue;
    }
    .menuNavigazione a
    {
    background: url(img/logo/xxxx.jpg);
    color:blue;
    }
    
    .menuNavigazione a:hover, .menuNavigazione a:focus, .menuNavigazione a:active
    { background: url(img/logo/xxxx.jpg);
    color: red;
    text-decoration: underline;
    
    }
    .menuNavigazione a.continua
    {
    background:url(img/logo/xxxx.jpg) center no-repeat;
    }
    .menuNavigazione ul.continua
    {
    background:url(img/logo/xxxx.jpg) center no-repeat;
    }
    </style>
    <script>
    menuClassName = "menuNavigazione";
    
    function closeSub(menu)
    {
    for(var i=0; i<menu.childNodes.length; i++)
    {
    if(menu.childNodes*.nodeName.toLowerCase()=="li")
    {
    li = menu.childNodes*;
    li.onmouseover = li.onactivete = li.onfocus = function(){if(this.subMenu)this.subMenu.className = this.subMenu.className.replace(/subMenu-off/g,"subMenu-on")};
    li.onmouseout = li.ondeactivate = li.onblur = function(){if(this.subMenu) closeSub(this.subMenu)};
    for(j=0; j<li.childNodes.length; j++)
    {
    if(li.childNodes[j].nodeName.toLowerCase()=="ul" || li.childNodes[j].nodeName.toLowerCase()=="ol")
    {
    closeSub(li.subMenu = li.childNodes[j]);
    }
    }
    }
    }
    menu.className = menu.className.replace(/\s?subMenu-on/g,"")+" subMenu-off";
    }
    
    window.onload = function(e){
    if(tags_ = document.getElementsByTagName('ul'))
    {
    for(i=0; i<tags_.length; i++)
    {
    if(tags_*.className==menuClassName)
    {
    closeSub(tags_*);
    }
    
    }
    }
    if(tags_ = document.getElementsByTagName('ol'))
    {
    for(i=0; i<tags_.length; i++)
    {
    if(tags_*.className==menuClassName)
    {
    closeSub(tags_*);
    }
    
    }
    }
    }
    </script>
    
    </head>
    <body>
    <div align=center>
    <ul class="menuNavigazione">
    <li><a href="#" class="continua">Menù 1</a>
    <ul>
    <li><a href="#">Lavori in corso</a></li>
    </ul>
    <li><a href="#" class="continua">I nostri servizi</a>
    <ul>
    
    <LI><a href="acon.php" target="_self">Acquisti e Consumi</a></li>
    <li><a href="ali.php" target="_self">Alimentazione</a></li>
    <li><a href="assi.php" target="_self">Assicurazioni</a></li>
    <li><a href="casute.php" target="_self">Casa e Utenze</a></li>
    <li><a href="inter.php" target="_self">Internet</a></li>
    <li><a href="risp.php" target="_self">Risparmio</a></li>
    <li><a href="sal.php" target="_self">Salute</a></li>
    <li><a href="tel.php" target="_self">Telefonia</a></li>
    <li><a href="sersoc.php" target="_self">Servizi e Società</a></li>
    <li><a href="tutra.php" target="_self">Turismo e Trasporti</a></li>
    <li><a href="tvme.php" target="_self">Tv e Media</a></li>
    
    </ul>
    </li>
    <li><a href="#" class="continua"> Link amici</a>
    <ul>
    <li><a href="#">Prima sottovoce</a></li>
    <li><a href="#">Seconda sottovoce</a></li>
    <li><a href="#">Terza sottovoce</a></li>
    </ul>
    </li>
    <li><a href="#" class="continua">Menù 4</a>
    <ul>
    <li><a href="#">Lavori in corso</a></li>
    </ul>
    </ul>
    </div>
    
    

    Se provo a dare un'unica dimensione ai 4 pulsanti, mi sballano i sottomenù che si posizionano di ca 3cm più a destra creando un effetto brutto oltre al fatto che mi sballa tutto il resto.

    Un bacione da un'imbranata