dropdown di Twitter splitdowndown

Ho una barra di navigazione e ho un accento accanto al menu a discesa.dropdown di Twitter splitdowndown

Nel codice corrente, se l'utente fa clic su Operations testo o punto di inserimento, viene aperto il menu a discesa. Ma ho bisogno di questo:

Se l'utente fa clic Operations collegamento, voglio all'utente di andare alla mia pagina /operations/.
Se l'utente fa clic sul punto di inserimento, il menu a discesa sarà visibile. Se l'utente fa clic su uno degli elementi del menu a discesa, l'utente verrà reindirizzato alla pagina correlata.

Fiddle: http://jsfiddle.net/mavent/UtDqm/2/

<div class="navbar navbar-inverse"> 
    <li class="dropdown" id="myTools"> 
    <a class="dropdown-toggle" data-toggle="dropdown" href="#myTools"> 
     Operations 
     <b class="caret"></b> 
    </a> 
    <ul class="dropdown-menu"> 
     <li><a href="/mypage1/">MyPage 1</a></li> 
     <li><a href="/mypage2/">MyPage 2</a></li> 
    </ul> 
    </li> 
</div>

twitter documentazione bootstrap si fa notare come creare menù a discesa pulsante Dividi here. Non voglio usare i pulsanti. È possibile avere un comportamento diviso senza utilizzare i pulsanti. Solo con i link?

fonte

2013-06-06 trante

Perché non basta avvolgere il punto di inserimento nel 'discesa-toggle' e aggiungere un normale' href' al testo operazioni? Vedi [qui] (http://jsfiddle.net/UtDqm/5/) –

@JoshuaM stesso comportamento come la risposta di Stevie. Funziona ma il cursore passa alla riga successiva in navbar. [link immagine] (http://img571.imageshack.us/img571/4656/oper1.jpg) – trante

Hai lo stile 'a' come' display: block'? Questo è tutto ciò a cui riesco a pensare, dato che [funziona bene per me.] (Http://i.imgur.com/muE2sMI.png) –

Non potresti semplicemente dividere il collegamento Operazioni in un nuovo tag <a>?

<div class="navbar navbar-inverse"> 
    <li class="dropdown" id="myTools"> 
    <a href="/operations/" style="display:inline-block;padding-right:0px;">Operations</a> 
    <a class="dropdown-toggle" data-toggle="dropdown" href="#myTools" style="display:inline-block;padding-left:0px;"> 
     <b class="caret"></b> 
    </a> 
    <ul class="dropdown-menu"> 
     <li><a href="/mypage1/">MyPage 1</a></li> 
     <li><a href="/mypage2/">MyPage 2</a></li> 
    </ul> 
    </li> 
</div>

fonte

2013-06-06 13:30:49

Funziona ma il cursore passa alla riga successiva in navbar. [image] (http://img571.imageshack.us/img571/4656/oper1.jpg) – trante

Vedere le mie modifiche, lo stile sottoposto a override funziona. –

Che funziona benissimo, grazie :) – trante

Stai cercando qualcosa di simile?

<div class="btn-group"> 
    <a href="http://google.com" target="_blank" class="btn btn-link">Action</a> 
    <a href="#" class="btn btn-link dropdown-toggle" data-toggle="dropdown"> 
    <span class="caret"></span> 
    </a> 
    <ul class="dropdown-menu"> 
     <li><a href="/mypage1/">MyPage 1</a></li> 
     <li><a href="/mypage2/">MyPage 2</a></li> 
    </ul> 
</div>

http://jsfiddle.net/UtDqm/6/

fonte

2013-06-06 13:32:13 Jako

risposta

Problemi correlati