Visualizzazione dei risultati da 1 a 7 su 7

Discussione: menù a tendina

  1. #1
    Utente bannato
    Registrato dal
    Feb 2011
    Messaggi
    84

    menù a tendina

    ciao a tutti ho scaricato questo ( http://javascript.html.it/script/ved...enu-a-tendina/ ) script per creare un menù a tendina, questo è il codice
    codice:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" lang="it">
    <head>
    
    	<title>Menù a tendina - Esempio JavaScript scaricato da HTML.it</title>
    	<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1" />
    	<meta http-equiv="Content-Language" content="it" />
    	<meta name="Robots" content="All" />
    	<meta name="Description" content="HTML.it - il sito italiano sul Web publishing" />
    	<meta name="Keywords" content="Un menù a tendina molto semplice da configurare e da personalizzare." />
    	<meta name="Owner" content="HTML.it srl" /> 
    	<meta name="Author" content="HTML.it srl" />  
    	<meta name="Copyright" content="HTML.it srl" />
    
    <style type="text/css">
    
    #csstopmenu, #csstopmenu ul{
    padding: 0;
    margin: 0;
    list-style: none;
    }
    
    #csstopmenu li{
    float: left;
    position: relative;
    }
    
    #csstopmenu a{
    text-decoration: none;
    }
    
    .mainitems{
    border: 1px solid black;
    border-left-width: 0;
    background-color: #D8FE89;
    }
    
    .headerlinks a{
    margin: auto 8px;
    font-weight: bold;
    color: black;
    }
    
    .submenus{
    display: none;
    width: 10em;
    position: absolute;
    top: 1.2em;
    left: 0;
    background-color: #EEFFCC;
    border: 1px solid black;
    }
    
    .submenus li{
    width: 100%;
    }
    
    .submenus li a{
    display: block;
    width: 100%;
    text-indent: 3px;
    }
    
    html>body .submenus li a{ /* non IE browsers */
    width: auto;
    }
    
    .submenus li a:hover{
    background-color: yellow;
    color: black;
    }
    
    #csstopmenu li>ul {/* non IE browsers */
    top: auto;
    left: auto;
    }
    
    #csstopmenu li:hover ul, li.over ul {
    display: block;
    }
    
    html>body #clearmenu{ /* non IE browsers */
    height: 3px;
    }
    
    </style>
    
    <script type="text/javascript">
    
    startMenu = function() {
    if (document.all&&document.getElementById) {
    cssmenu = document.getElementById("csstopmenu");
    for (i=0; i<cssmenu.childNodes.length; i++) {
    node = cssmenu.childNodes[i];
    if (node.nodeName=="LI") {
    node.onmouseover=function() {
    this.className+=" over";
    }
    node.onmouseout=function(){                  
    this.className=this.className.replace(" over", "")
    }
    }
    }
    }
    }
    
    if (window.attachEvent)
    window.attachEvent("onload", startMenu)
    else
    window.onload=startMenu;
    
    </script>
    
    </head>
    <body >
    
    
    
    <div align="center">
    
    
    <ul id="csstopmenu">
    
    <li class="mainitems" style="border-left-width: 1px">
    <div class="headerlinks">HTML.it</div>
    <ul class="submenus">[*]Prova[*]Testo[*]Prova[*]Testo[/list]
    
    
    <li class="mainitems">
    <div class="headerlinks">FREEPHP</div>
    <ul class="submenus" style="width: 14em">[*]Prova[*]Testo[*]Prova[/list]
    
    
    <li class="mainitems">
    <div class="headerlinks">FREEASP</div>
    <ul class="submenus">[*]Testo[/list]
    
    [/list]
    
    <div id="clearmenu" style="clear: left"></div>
    
    
    </div>
    
    
    
    
    
    
    
    	<div align="center">
    [img]logo_htmlit.gif[/img]
    	</div>
    	
    
    </body>
    </html>
    il mio problema è che vorrei mettere le voci principali, per intenderci:
    HTML.it
    FREEPHP
    FREEASP

    non in orizzontale una accanto all'altra, ma in verticale, una sopra l'altra e che la tendina si apra comunque sotto,spero di essere stato chiaro.
    qualcuno mi può aiutare?
    grazie a tutti
    ciao

  2. #2
    Utente bannato L'avatar di Fronte
    Registrato dal
    Dec 2010
    Messaggi
    358
    Prova a metter e nel css dove vuoi che venga il verticale .-.-..

    writing-mode: tb-rl;

  3. #3
    Utente bannato
    Registrato dal
    Feb 2011
    Messaggi
    84
    Originariamente inviato da Fronte
    Prova a metter e nel css dove vuoi che venga il verticale .-.-..

    writing-mode: tb-rl;
    lo devo mettere in una classe del css?
    potresti dirmi quale perchè con il css sono ancora nuovo
    grazie 1000

  4. #4
    Utente bannato L'avatar di Fronte
    Registrato dal
    Dec 2010
    Messaggi
    358
    AH sabba tentar non nuoce , vai tranquillo ,,, metti e godi...

  5. #5
    Utente bannato
    Registrato dal
    Feb 2011
    Messaggi
    84
    Originariamente inviato da Fronte
    AH sabba tentar non nuoce , vai tranquillo ,,, metti e godi...
    ok provo a inserire ciò che mi hai detto in una classe alla volta finche non trovo quella giusta
    ti faccio sapere

  6. #6
    Utente bannato
    Registrato dal
    Feb 2011
    Messaggi
    84
    risolto inserendo in tutte le classi il codice
    codice:
    writing-mode: tb-rl;
    ora cercherò di capire in quali classi serve e in quali no

  7. #7
    Utente bannato L'avatar di Fronte
    Registrato dal
    Dec 2010
    Messaggi
    358
    puoi anche alternare dal basso all ato e viceversa , basta che cambi il tb-rl;
    ciao ciao

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2026 vBulletin Solutions, Inc. All rights reserved.