Colorare link al click

Shyson

Utente Attivo
19 Ago 2012
1.179
1
38
Ho questo link che apre un popup jQuery. Ho bisogno di colorare il link di rosso quando è attivo, e quando lo chiudo deve tornare al colore originale.

PHP:
//Disclaimer
function disclaimer() {
   $(document).ready(function() {
     $(".flipM").click(function(){
     var id = $(this).attr("id");
   if($("#r" + id).css("display") == "none")
     $("#r" + id).slideDown("fast");
    else
   $("#r" + id).slideUp("fast");
    });
   });
  };

...


/* Disclaimer */
.flipM { 
    display:inline;
    font-size: 0.95em; color: #999;
    font-weight: 500; 
    cursor: pointer;
}
 
.flipM:hover {
    color: #0080ff;
}
 
.panelM {
    width: 600px; 
    height: auto;
    font-size: 1.2em; color: #d50202;
    margin: 0 auto;
    text-align: left;
    padding: 5px 5px 5px 5px;
    margin-top: -12px;
    display: none;
    border: 1px dashed green;
}

...

<script>disclaimer();</script>
<div id="2x" class="flipM"> Disclaimer</div>

<div id="r2x" class="panelM">Testo...</div>
 
Ultima modifica:

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Duplicare le discussioni è vietato dal nostro regolamento
elimino l'altra
l'istruzione che ti serve è
Codice:
$(this).css("color","red");
 

Shyson

Utente Attivo
19 Ago 2012
1.179
1
38
Duplicare le discussioni è vietato dal nostro regolamento
elimino l'altra
l'istruzione che ti serve è
Codice:
$(this).css("color","red");

Ho messo così ma non si clicca più

//Disclaimer
function disclaimer() {
$(document).ready(function() {
$(".flipM").click(function(){
var id = $(this).attr("id");
if($("#r" + id).css("display") == "none")
$(flipM).css("color","red");
$("#r" + id).slideDown("fast");
else
$("#r" + id).slideUp("fast");
});
});
};
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
io ho scritto
Codice:
$(this).css("color","red");
non
Codice:
$(flipM).css("color","red");
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
devi mettere le istruzioni tra parentesi graffe
puoi ometterle solamente se dopo la if c'è una sola istruzione
 

Shyson

Utente Attivo
19 Ago 2012
1.179
1
38
Così non va, dove sbaglio?

PHP:
//Disclaimer 
function disclaimer() {
$(document).ready(function() {
                $(".flipM").click(function(){
                    var id = $(this).attr("id");
                   if($("#r" + id).css("display") == "none")
                   $(this).css("color","red") {
                        $("#r" + id).slideDown("fast");
                    else
                        $("#r" + id).slideUp("fast");
                        }
                });
            });
        };
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
l'apertura della parentesi va dopo la if e la chiusura dopo le due istruzioni
HTML:
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script>   
    $(document).ready(function() {
        $(".flipM").click(function(){
            var id = $(this).attr("id");
            if($("#r" + id).css("display") == "none") {
                $(this).css("color","red");
                $("#r" + id).slideDown("fast");
            }else {
                $(this).css("color","black");
                $("#r" + id).slideUp("fast");
            }                    
        });
    });
</script>
<div id="2x" class="flipM"> Disclaimer</div>
<div id="r2x" style="display:none">contenuto disclaimer</div>
 

Shyson

Utente Attivo
19 Ago 2012
1.179
1
38
Non si clicca, ho messo così:

PHP:
function disclaimer() {
 $(document).ready(function() {
        $(".flipM").click(function(){
            var id = $(this).attr("id");
            if($("#r" + id).css("display") == "none") {
                $(this).css("color","red");
                $("#r" + id).slideDown("fast");
            }else {
                $(this).css("color","black");
                $("#r" + id).slideUp("fast");
            }                    
        });
    });    

...

<script>disclaimer();</script>


<div id="2x" class="flipM"> Disclaimer</div>
<div id="r2x" style="display:none">contenuto disclaimer</div>
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
anche se non capisco il motivo della funzione disclaimer(), a me il codice funzione anche come lo hai postato tu
HTML:
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script>   
    function disclaimer() {
        $(document).ready(function() {
            $(".flipM").click(function(){
                var id = $(this).attr("id");
                if($("#r" + id).css("display") == "none") {
                    $(this).css("color","red");
                    $("#r" + id).slideDown("fast");
                }else {
                    $(this).css("color","black");
                    $("#r" + id).slideUp("fast");
                }                    
            });
        });    
    }
</script>
<script>disclaimer();</script>


<div id="2x" class="flipM"> Disclaimer</div>
<div id="r2x" style="display:none">contenuto disclaimer</div>
 

Shyson

Utente Attivo
19 Ago 2012
1.179
1
38
Ora funziona tutto, tranne l'hover. Cioè, l'hover funziona solo la prima volta, poi clicco il link e si apre il popup. Ma poi quando richiudo il popup l'hover non si colora più se ci passo sopra col mouse. Ricomincia a colorarsi se ricarico la pagina.

PHP:
.flipM:hover {
	color: #0080ff;
}
 
Ultima modifica:
Discussioni simili
Autore Titolo Forum Risposte Data
Dragon Javascript: colorare cella con link Javascript 0
G Colorare menu select attraverso ricerca php PHP 0
B [Photoshop] Colorare tracciato Photoshop 1
C Colorare righe tabella tramite condizione Java 5
M colorare il tasto del menu all'apertura del div HTML e CSS 19
G Non riesco a colorare una campitura con lo strumento penna Photoshop 1
R Colorare parzialmente una figura con i css HTML e CSS 6
L colorare variabile ricerca file testo PHP 2
V Colorare cella HTML e CSS 2
G Usare clone per colorare ma senza sbavare, come posso procedere? Photoshop 2
C Colorare i button con una function Javascript 35
Web Designer Colorare la Legenda Gruppi in MyBB CMS (Content Management System) 0
L Colorare immagine usando colori RGB Photoshop 18
C Colorare nick in base al sesso dell utente PHP 4
I Colorare records tabella Database 0
A Colorare le barrette di scorrimento HTML e CSS 4
Eugene CSS per colorare barre di scorrimento - vietato? HTML e CSS 3
C colorare il border di un immagine HTML e CSS 5
H Colorare le barre di scorrimento HTML e CSS 20
diodo colorare le scrollbar HTML e CSS 1
M come colorare i recordset con asp Classic ASP 1
N Ma come cavolo faccio a colorare la barra di scorrimento.... HTML e CSS 9
A Malfunzionamento Vodafone Station e Kit Powerline D-Link DHP-W311AV Adsl e Connettività 0
D [COMPRO/CERCO] GUEST POST o scambio link per sito di Spiritualità ed Esoterismo. Vendere e Acquistare pubblicita' online 0
S tracciare i link in uscita Google Analytics 1
U Link a doppio file PHP PHP 0
S [CERCO] scambio di articoli con link Offerte e Richieste di scambio links 0
U Link a pagina ed esecuzione file PHP 0
D Inserire link PHP 0
A Regex per isolare link interni con rel noopener PHP 0
Shyson Modificare codice e creare link PHP 0
M Come individuare il link sito entrante Google Analytics 1
W Elenco dei link del file presenti in una cartella PHP 2
P modifica colore A Hover link website . WordPress 2
T Offuscare link pagina web PHP 2
D Estrarre database con link esterno Database 10
W Creare link di una dato Classic ASP 0
M Visualizzare file PDF con link preso dal DB PHP 0
G Link Building da aggregatori e nuovo social network SEO e Posizionamento 1
G PHP e Microsoft Teams: generare link videocall PHP 15
Shyson Link social penalizzano il sito? SEO e Posizionamento 14
G Rendere dati di una tabella mysql link PHP 22
Shyson Mascherare link di affiliazione PHP 0
F domanda sul link juice SEO e Posizionamento 2
C Problema tp-link extender cp210 Reti LAN e Wireless 9
M [Wordpress] Slider Revolution automatic link WordPress 0
diamantetredici13 [HTML] link e poi link... HTML e CSS 2
D [WordPress] Link eliminati ancora presenti nel database, è possibile? WordPress 0
Shyson [PHP] Aggiungere link al codice PHP 0
K [PHP] Link Obfuscator PHP 5

Discussioni simili