Come disattivare Hover CSS con JavaScript

August 30

Come disattivare Hover CSS con JavaScript


Hypertext Markup Language (HTML) dà accesso programmatori alle pagine Web attraverso il Document Object Model o DOM. Un programmatore esperto può controllare e modificare i tag HTML, styling contenuto informativo e di pagina. Questi elementi fanno parte dell ' "oggetto documento" e sono accessibili per il metodo di JavaScript getElementById (). Mentre l'attributo hover di un collegamento non è direttamente accessibile da JavaScript, se si creano due classi, una con un attributo hover e uno senza, che può essere commutata tramite il comando JavaScript "document.getElementById (" idName "). ClassName =" Newclassname. "

istruzione

1 Avviare uno standard, testo semplice editor di che è disponibile sul computer.

2 Inserire il codice seguente nel editor di testo.

<Html>

<Head>

<Style type = "text / css">

a.mhover: link {color: #green;}

a.mhover: visited {color: #green}

a.mhover: hover {color: #red;}

a.mhover: attiva {color: #yellow;}

a.yhover: link {color: #green;}

a.yhover: visited {color: #green}

a.yhover: attiva {color: #yellow;}

</ Style>

<Script language = "javascript">

funzione changeClass () {

. Document.getElementById ( "AAB") className = "yhover";

}

</ Script>

</ Head>

<Body>

<H1>

<a href="javascript:changeClass()" id="aab" class="mhover"> Clicca per fermare collegamento hover. </a>

</ H1>

</ Body>

</ Html>

3 Fare clic sul menu File. Selezionare l'opzione "Salva". Salvare sotto il nome del file "test.html."

4 Avviare il browser web che è disponibile sul computer. Fare clic sulla voce di menu "File" e selezionare "Apri file".

5 Individuare il file "test.html" appena creato, selezionarlo con il mouse e cliccare su "Apri".

Consigli e avvertenze

  • Il hover CSS può essere disattivato quando la pagina viene caricata aggiungendo l'evento "onload" al tag body. Sostituire il <body> che si trova nel file "test.html" e sostituirlo con <body onLoad = "javascript: changeClass ()">. Salvare il file e ricaricarlo nel browser per testare il cambio.
  • I browser meno recenti non possono eseguire correttamente il cambiamento JavaScript del nome della classe. Verificare sempre il codice su diversi browser e le versioni precedenti dello stesso browser al fine di garantire le opere di codice come previsto.