2015-01-11 22 views
5

Ho usato bootstrap nel mio menu principale e poiché il mio progetto ha un sacco di pagine, sottopagine e sotto-pagine ho usato il menu a discesa bootstrap per navigare attraverso questo.Bootstrap collegamento aperto quando si fa clic sul pulsante del menu a discesa

Il mio cliente ora vuole essere in grado di andare al collegamento associato anche al pulsante a discesa, piuttosto che ai bambini. Il mio cliente ha un testo in una pagina chiamata "assistenza clienti" e testo nelle sottopagine (bambini). Idealmente voglio che l'utente faccia prima clic su un pulsante dropdownmenu (es. "Servizio clienti"), e si apra un menu a discesa (che fa Bootstrap), e con un secondo clic si può andare al link associato a quel pulsante menu a discesa (ex . "/assistenza clienti").

io condividere un po 'di codice per renderlo un po' più comprensibile:

<body> 
<nav class="navbar navbar-default"> 
    <div class="container-fluid"> 
     <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 
      <ul class="nav navbar-nav"> 
       <li class="dropdown"> <a href="/customer-service" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Dropdown <span class="caret"></span></a> 

        <!-- click this menu-button once, and the submenu below opens, click this menu-button twice and you go to /customer-service --> 
        <ul class="dropdown-menu" role="menu"> 
         <li><a href="#">Action</a> 
         </li> 
         <li><a href="#">Another action</a> 
         </li> 
         <li><a href="#">Something else here</a> 
         </li> 
         <li class="divider"></li> 
         <li><a href="#">Separated link</a> 
         </li> 
        </ul> 
       </li> 
      </ul> 
      <ul class="nav navbar-nav"> 
       <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Dropdown <span class="caret"></span></a> 

        <ul class="dropdown-menu" role="menu"> 
         <li><a href="#">Action</a> 
         </li> 
         <li><a href="#">Another action</a> 
         </li> 
         <li><a href="#">Something else here</a> 
         </li> 
         <li class="divider"></li> 
         <li><a href="#">Separated link</a> 
         </li> 
        </ul> 
       </li> 
      </ul> 
     </div> 
    </div> 
</nav> 

http://jsfiddle.net/kozog9rx/2/

(assicuratevi di leggere il commento nel codice HTML e dare il "Risultato-view" abbastanza spazio/larghezza in modo appare il menu)

+2

Si prega di condividere un po 'di codice, sarà più facile capire il tuo problema e più espressivo in questo modo, che scrivere su di esso :) – surajck

+0

Ti ringrazierò, mi dispiace per il mio assenso per alcuni giorni. Ero abbastanza occupato con un altro progetto :) – Jackques

+0

Ho cambiato il titolo e il testo del mio post per renderlo più chiaro. Puoi o qualcun altro, per favore, dargli un'altra occhiata? – Jackques

risposta

3

Beh, supponendo che si sta utilizzando bootstrap 3.2.0 Ecco il codice:

Quello che sto facendo è rendere la caratura aprire il menu e il testo href dove vuoi che vada.

+0

Grazie per il tuo esempio. L'ho provato, ma non dà il risultato che speravo, perché quando lo eseguo nel mio sviluppo. gli utenti devono fare clic sulla freccia/cursore in modo separato per andare al link e sul testo "Dropdown" per aprire il menu a discesa. Desidero che l'utente apra il menu a discesa al primo clic sul pulsante e che passi al collegamento quando l'utente fa nuovamente clic sullo stesso menu. Credo che questo possa essere ottenuto tramite JS, ma poiché questo è Bootstrap e JS di livello molto profondo non ho idea di dove cominciare. – Jackques

Problemi correlati