[HTML] :target e :hover

amaranthinemess

Nuovo Utente
18 Giu 2019
4
0
1
Milano
www.elenaspadafora.it
Buongiorno a tutti, non mi sembra di aver visto un topic simile già aperto, in caso contrario mi scuso
icon_smile.gif


Ciò che vorrei è che, passando il mouse su un elemento A venisse evidenziato un elemento B.
Esempio: fila di bottoni sopra, fila di box sotto, passando su un bottone si evidenzia il relativo box.

Conosco questo effetto utilizzando :target ma si attiva cliccando sull'elemento A, io invece vorrei che la modifica all'elemento B si attivasse solo passando col mouse (come per un :hover).

Spero di essermi spiegata bene, grazie mille a chiunque vorrà aiutarmi
icon_smile.gif
 

Tommy03

Utente Attivo
6 Giu 2018
614
58
28
18
Vicenza
Usando JQuery potresti fare così:
HTML:
<div id="cont1">Passa sopra il mouse</div>
<div id="cont2">Contenuto che verrà evidenziato</div>
<script src="https://code.jquery.com/jquery-3.4.0.min.js" type="text/javascript"></script>
<script>
$("#cont1").hover(function(){
  $(#cont2).css("background-color", "yellow");
  }, function(){
  $("#cont2").css("background-color", "white");
});
</script>
 

amaranthinemess

Nuovo Utente
18 Giu 2019
4
0
1
Milano
www.elenaspadafora.it
Usando JQuery potresti fare così:
HTML:
<div id="cont1">Passa sopra il mouse</div>
<div id="cont2">Contenuto che verrà evidenziato</div>
<script src="https://code.jquery.com/jquery-3.4.0.min.js" type="text/javascript"></script>
<script>
$("#cont1").hover(function(){
  $(#cont2).css("background-color", "yellow");
  }, function(){
  $("#cont2").css("background-color", "white");
});
</script>
Ciao grazie mille:) Ma dovrebbe già funzionare così? Perché non succede nulla :(

EDIT: Come non detto, grazie mille, se al posto degli id uso le classi funziona! Grazie!
 
Ultima modifica:

|$Alessandro$|

Nuovo Utente
9 Ago 2019
7
0
1
Ciao amaranthinemess, ho visionato la tua richiesta e penso che ci sia un modo più semplice di gestirla anziché utilizzare JavaScript o Php. La mia proposta è quella di utilizzare il semplice CSS nel seguente modo:

HTML:
<div id="cont1">Passa sopra il mouse</div>
<div id="cont2">Contenuto che verrà evidenziato</div>

<style>
#cont1:hover~#cont2{
 /*Qua puoi modificare lo stile css del contenitore 2.*/
}
</style>
 
Ultima modifica di un moderatore:
Discussioni simili
Autore Titolo Forum Risposte Data
R Immagini html HTML e CSS 1
K File audio in html, chi mi può aiutare? HTML e CSS 0
K Aiuto con file audio in html HTML e CSS 1
Antonio67 Lanciare file shell bash da html HTML e CSS 2
M Riportare in tabella HTML dati estratti con query SQL MySQL 0
G Codice html Javascript 1
M Collegamento tra form html e script php PHP 4
L Ricezione dei dati su file php da modulo html PHP 6
F Creare elementi html con javascript Javascript 4
G Appicazione HTML per inserimento dai in Database Access Microsoft HTML e CSS 0
W visualizzare solo file html e sottocartelle di una cartella PHP 1
C Dopo chiusura del tag php la stringa html va a capo PHP 1
G img html HTML e CSS 3
M Come fare un countdown in HTML? HTML e CSS 4
D Stampa a video in altra pagina html Database 3
A inserire variabile php colore in div html PHP 2
F Tv in html Offerte e Richieste di Lavoro e/o Collaborazione 1
N Script elenco file HTML HTML e CSS 5
L salvare codice html in mysql PHP 3
Cosina htaccess redirect 301 senza estensione html Web Server 6
E Errore di lettura php in html PHP 8
M HTML e PHP Offerte e Richieste di Lavoro e/o Collaborazione 3
C Form email php su pagina index.html? PHP 21
Shyson Meglio Javascript o HTML? Javascript 4
P inserimento icone social tramite html HTML e CSS 1
Z Mod_rewrite da HTML in PHP PHP 3
L Collegare un form html ad un database access Javascript 2
P HTML integrazione wordpress HTML e CSS 0
C [RISOLTO]Inserimento variabile php in input html PHP 20
L Eliminare estensione .html HTML e CSS 9
max1974 html in tooltip Javascript 0
C Risalire al php da html PHP 27
felino Esportare tabella HTML in PDF, quale libreria usare? Javascript 1
webmachine [PHP] [JAVASCRIPT] Form strano in HTML PHP PHP 1
L [RISOLTO] Stampa a video risultato count in html PHP 13
V Servizio design pagina web e download in self contained html file Discussioni Varie 1
F [PHP] Form html PHP 2
G Aiuto HTML, collegamento con un bottone a una <div> di un' altra pagna HTML e CSS 5
R Aiuto sito html Offerte e Richieste di Lavoro e/o Collaborazione 3
M Estrarre dati da una select HTML PHP 3
G FORM HTML E PHP PHP 0
max1974 [HTML] Columns grid on modal form HTML e CSS 0
tomorc [HTML] Problema con scroll bar (risolto) HTML e CSS 0
F [PHP] [HTML] Tabella cambia pagina responsive PHP 8
M [PHP] [HTML] Centrare in verticale un pulsante in una tabella PHP 3
S [HTML] Effetto su testo da togliere HTML e CSS 0
M [PHP] Istruzione "echo" all'interno di codice html PHP 2
D [HTML] Aiutino su costruzione tabella :) HTML e CSS 3
diamantetredici13 [HTML] link e poi link... HTML e CSS 2
P [HTML] Problema ERR_INCOMPLETE_CHUNKED_ENCODING 206 (Partial Content) con Font HTML e CSS 1

Discussioni simili