Barra navigazione responsive tipo Bootstrap. Inserire icona chiusura menù a discesa.

[miauhaus]

Ho realizzato una navbar responsive. Ho messo la classica icona ≣ (Font Awesome) per la discesa del menù , che si chiude cliccandoci nuovamente sopra.
Vorrei invece che una volta aperto apparisse un' icona X di chiusura.
QUI JSFiddle
QUI il sito.
Ringrazio in anticipo.

[cavicchiandrea]

Non uso bootstrap e non posso aiutarti, ti volevo segnalare che con iPad mini display retina su safari hai dei problemi con lo scroll scorrendo la pagina sia in discesa (solo la prima volta) che in salita (sempre) scatta un refresh e ricarica la slide iniziale

[miauhaus]

Neanche io ho usato Bootstrap : solo css e jquery.
Ti ringrazio per la segnalazione sullo scrolling iPad: cercherò di capirci qualcosa.

[Vindav]

la x deve comparire al posto dell'altra icona?

if ($toggleMenu.hasClass("active")) {
         $toggleMenu.text("");
         $navbar.slideUp("fast");
         $toggleMenu.toggleClass("active");
     } else {
         $toggleMenu.text("X");
         $navbar.slideDown("fast");
         $toggleMenu.toggleClass("active");
     }

[miauhaus]

Sì.
E poi , preferibilmente, far riapparire l'icona precedente una volta chiusa la tendina.

[CristianaPopa]

Ciao,

Tenendo conto della tua soluzione io ho messo un'altro paragrafo sotto il paragrafo con la <toggle-menu> classe e cambio i paragrafi tra loro con show/ hide.
Vedi qui le modifiche https://jsfiddle.net/skkdrw5n/24/
Ho fatto cosi perche in questo modo puoi inserire qualsiasi immagine che vuoi.

Cristiana,
#OracleCloud.

[miauhaus]

Perfetto. Grazie Cristiana