Menu navigazione: evidenziare link al click

F

feelthemusic

Nuovo Utente
29 Nov 2012
14
0
0
Salve a tutti, ho un pagina html strutturata con gli iframe. Nell'iframe vengo caricati i link del menu di navigazione. Vorrei sapere se è possibile fare in modo che al click di un link nel menu di navigazione il link stesso venga evidenziato e che cliccando su un altro link quello precedente torni normale e venga evidenziato solo quello corrispondente alla pagina visualizzata. Non so se mi sono spiegato bene xD cmq qualcuno mi sa aiutare?
 
alessandro1997

alessandro1997

Utente Attivo
6 Ott 2009
5.302
1
0
26
Roma
alessandro1997.netsons.org
Piccolo esempio che ho preparato al volo:
HTML: 
<!DOCTYPE html>
<html lang="it">
  <head>
    <title>Evidenziazione link</title>
    <meta charset="utf-8" />

    <style type="text/css">
    .active { font-weight: bold; }
    </style>
  </head>

  <body>
    <nav id="menu">
      <ul>
        <li><a href="#">Link 1</a></li>
        <li><a href="#">Link 2</a></li>
        <li><a href="#">Link 3</a></li>
        <li><a href="#">Link 4</a></li>
        <li><a href="#">Link 5</a></li>
      </ul>
    </nav>

    <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.0.min.js"></script>
    <script type="text/javascript">
    $(function() {
      $("#menu li").click(function() {
        $("#menu li.active").removeClass("active");
        $(this).addClass("active");
      });
    });
    </script>
  </body>
</html>
Ovviamente per modificare lo stile dei link attivi basta modificare la classe active.
 
Devi accedere o registrarti per poter rispondere.
Discussioni simili
Autore Titolo Forum Risposte Data
L [css e html] destra e sinistra (menu navigazione) HTML e CSS 3
Selenio89 [HTML] creare menu di navigazione HTML e CSS 2
G Problemi menu di navigazione HTML e CSS 0
L Effetto menu di navigazione. HTML e CSS 10
B [Help] Menu navigazione laterale con testo curvo Javascript 2
T problemi con dati menu a tendina HTML e CSS 2
A menu a tendina php PHP 1
M Accordion menu e posizione div HTML e CSS 0
F Menu responsive larghezza schermo HTML e CSS 2
G Colorare menu select attraverso ricerca php PHP 0
M Creazione menu a tendina Javascript 3
D menu con submenu orizzontale HTML e CSS 0
Cosina Menu fisso copre i titoli quando cliccati nel sommario jQuery Javascript 4
G creazione menu a tendina e invio a pagina php PHP 1
P Sub menu con Collapse. Javascript 0
R abilitare menu a tendina tramite relativa chekbox PHP 17
L Aiuto creazione menu mancante WordPress 0
S spostare il pulsante menu dropdown HTML e CSS 8
F Dropdown menu con tabella PHP 33
Spown [WordPress] Problemi visualizzazione su più browser + voci menu in movimento WordPress 1
A [WordPress] Menu bar WordPress 0
W [WordPress] Non si vedono le categorie da aggiungerle al Top Menu WordPress 3
M Inviare variabili da menu a tendina a pagina php con post PHP 6
M [PHP] Selezione da menu a discesa con 2 variabili PHP 0
F [WordPress] [HTML] Aggiungere una pagina solo allo sticky menu WordPress 4
M [PHP] Creare un menu a tendina con pdo PHP 18
M [Javascript] Caricamento menu da file esterno Javascript 8
W [HTML] Animazione menu mobile HTML e CSS 0
P [HTML] Eliminare doppio menu in wordpress WordPress 2
andreas88 [PHP] menu PHP 15
K [ASP.Net] Realizzazione menu a tendina dipendenti ASP.NET 1
M [HTML] problema spazio aggiuntivo tra elementi <li> di menu a tendina HTML e CSS 1
P [Gratuito][Cerco] qualcuno per fare menu a tendina ottimizzato per mobile-responsive con css e html Offerte e Richieste di Lavoro e/o Collaborazione 3
P [HTML] Problema con menu orizzontale a tendina per sito web HTML e CSS 17
P [Javascript] Voce del menu evidenziata in base alla pagina attiva Javascript 48
V [WordPress] Come modificare link in tasto menu css WordPress 21
S [Javascript] [CSS] Spazio Bianco tra Slider e Menu foto Javascript 6
P [Javascript] problema menu responsive su aruba, editor bk Javascript 1
Hellgrom90 Hamburger menu non si chiude jQuery 1
K [Javascript] Finestra menu Javascript 1
C [Javascript] [HTML] Problemi: Overlay, Banner, Menu Javascript 4
C 3 Bug CSS AND HTML: Overlay-Banner-Menu HTML e CSS 0
C 3 BUG CSS AND HTML: OVERLAY - BANNER- MENU HTML e CSS 0
M [PHP] Menu a tendina dinamico che non si aggiorna PHP 2
U [PHP] Selezione con menu a tendina e recupero selezione PHP 5
M Riadattamento funzioni per far scomparire un menu. jQuery 4
G [Javascript] Transition in OnClick Dropdown Menu Javascript 5
U [Javascript] Menu responsive non scompare col click sui link Javascript 0
A [Javascript] Problemi menu bootstrap Javascript 1
A [HTML] Menu con effetto slide down HTML e CSS 0

Discussioni simili

Alto Basso