Visualizzazione dei risultati da 1 a 2 su 2

Discussione: E' possibile creare un campo select funzionante in una categoria di wordpress?

  1. #1
    Utente di HTML.it
    Registrato dal
    Mar 2003
    residenza
    Prato
    Messaggi
    576

    E' possibile creare un campo select funzionante in una categoria di wordpress?

    Ciao
    Ho creato questo codice e volevo rendere i collegamenti funzionanti in una categoria di wordpress.

    codice HTML:
    <form><fieldset><select style="width: 300px;" name="fancy fabrics">
    <option>Select graphics</option>
    <option value="http://www.conceptfbo.it/fancy-fabrics/anchors/">Anchors</option>
    <option value="http://www.conceptfbo.it/fancy-fabrics/animals/">Animals</a></option>
    </select></fieldset></form>
    Il campo si vede ma se vado nelle voci non mi va nei collegamenti indicati! Come mai?

  2. #2
    Utente di HTML.it
    Registrato dal
    Apr 2017
    Messaggi
    2
    Ciao, ho trovato una parziale soluzione introducendo un minimo di Javascript

    codice:
    <form><fieldset><selectstyle="width:300px;"name="fancy fabrics"onChange="window.location.href=this.value">
    <option>Select graphics</option>
    <optionvalue="http://www.conceptfbo.it/fancy-fabrics/anchors/">Anchors</option>
    <optionvalue="http://www.conceptfbo.it/fancy-fabrics/animals/">Animals</option>
    </select></fieldset></form>
    Con onChange al cambiare dell'opzione il browser va dove selezionato.

    Tuttavia se ti serve un dropdown men¨ puoi farlo pi¨ semplicemente con CSS. Ho riadattato l'esempio fatto qui (https://www.w3schools.com/css/css_dropdowns.asp ), al tuo caso.

    Quindi inserisci nello stile


    codice:
    <style>/* Stile del Bottone*/
    .dropbtn {
    background-color:#4CAF50;
    color: white;
    padding:16px;
    font-size:16px;
    border: none;
    cursor: pointer;
    }
    
    
    /* Contenitore del men¨ */
    .dropdown {
    position: relative;
    display:inline-block;
    }
    
    
    /* Il contenuto del men¨ nascosto di default */
    .dropdown-content {
    display: none;
    position: absolute;
    background-color:#f9f9f9;
    min-width:160px;
    box-shadow:0px8px16px0px rgba(0,0,0,0.2);
    z-index:1;
    }
    
    
    /* Le voci del men¨ */
    .dropdown-content a {
    color: black;
    padding:12px16px;
    text-decoration: none;
    display: block;
    }
    
    
    /* Cambio di colore al passaggio del mouse */
    .dropdown-content a:hover {background-color:#f1f1f1}
    
    
    /* Mostrare men¨ */
    .dropdown:hover .dropdown-content {
    display: block;
    }
    
    
    /* Cambia il colore del bottone al passaggio del mouse */
    .dropdown:hover .dropbtn {
    background-color:#3e8e41;
    }
    </style>
    Invece per quanto riguarda il codice HTML, semplicemente sostituisci quello che hai da <form> in


    codice HTML:
    <divclass="dropdown"><buttonclass="dropbtn">Select Graphics</button>
    <divclass="dropdown-content">
    <ahref="http://www.conceptfbo.it/fancy-fabrics/anchors/">Anchors</a>
    <ahref="http://www.conceptfbo.it/fancy-fabrics/animals/">Animals</a>
    </div>
    </div>
    Ti ho messo qui l'esempio cosý da vederlo https://www.w3schools.com/code/tryit...e=FEE7HDTAIFYQ

    Spero sia tutto chiaro

Tag per questa discussione

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 © 2017 vBulletin Solutions, Inc. All rights reserved.