Fogli CS multipli o Javascript

1

Ho una home page con una barra di navigazione sulla parte superiore del Viewport contiene due pulsanti.

Uno è il tasto home predefinito selezionato che chiama / visualizza home.html. L'altro, ad esempio, è Ubuntu che chiama UbuntuTutorial.html.

Quando home è selezionato, i pulsanti home-bottom-border sono colorati mentre il bordo inferiore dal pulsante Ubuntu è trasparente per mostrare all'utente che si trova effettivamente nella sezione home del mio sito web

Ora, da un punto di vista professionale, è un modello comune creare due CSS quasi simili in cui l'unica differenza è il bordo inferiore colorato del pulsante cliccato (cioè home o ubuntu) o, che preferirei, recuperare il visualizza il file html corrente e colora il bordo inferiore del pulsante specifico con js ... evitando multipli css dove solo una linea differisce. (Ma tenendo anche presente che alcuni (quantità elevata, bassa quantità?) Di utenti disabilitati js ..)

Tutto è tenuto, a mio parere, professionale. Sto usando CSS esterno e file JS esterni.

    
posta Mike 03.04.2015 - 14:21
fonte

1 risposta

5

La solita soluzione in questa situazione è di avere una classe selected che definisce lo stile di un pulsante che rappresenta la pagina corrente, ovvero un colore diverso per il bordo inferiore.

Quando la pagina corrente cambia, usa JS per rimuovere la classe selected da tutti i pulsanti e aggiungila a quella appena cliccata.

    
risposta data 03.04.2015 - 15:22
fonte

Leggi altre domande sui tag