Ich habe momentan Probleme mit der Funktion jQuery css() . Es ändert den css-Wert des border-top-color des Ankerelements anstatt nur des border-top-color des Ankerelements, wenn er aktiviert ist. Unten ist mein Code.
Warum werden die Eigenschaften #header #headerlist li a border-top-color und #header #headerlist li a:hover geändert und nicht nur die Eigenschaft #header #headerlist li a:hover ?
Der Grund, warum dein Beispiel nicht funktioniert, ist, dass der Selektor keine Möglichkeit hat, zu erkennen: hover, da das eine reine CSS-Sache ist. Stattdessen können Sie versuchen, die tatsächliche Methode jquery hover zu verwenden:
%Vor%Alternativ können Sie auch die addclass-Methode verwenden:
%Vor%Dies könnte weiter vereinfacht werden zu:
%Vor%Ich weiß nicht genau warum, aber diese Art von Änderungen ist besser in CSS, also würde ich vorschlagen, dass, wenn Sie dies wirklich über JS ändern müssen, erstellen Sie eine CSS-Klasse, dann ändern Sie das in JS.
Auf diese Weise können Sie die Funktionalität besser von der Präsentation trennen.
Der Grund, warum es nicht funktioniert, liegt darin, dass das Bit :hover dem Selektor keine Informationen über ein Element liefert.
a:hover in CSS-Übereinstimmungen mit denselben exakten Elementen wie a , es definiert nur einen anderen Satz von Eigenschaften, wenn der Benutzer über diesen Elementen schwebt.
Der jQuery-Selektor wurde entwickelt, um Elemente zu finden (auszuwählen), nicht um sie zu stylen.
Die css() -Methode setzt einfach einen Inline-Stil für die ausgewählten Elemente, fügt nicht tatsächliche CSS-Deklarationen hinzu oder ändert sie.
Wie bereits erwähnt, können Sie das Ereignis hover() verwenden, um dasselbe Verhalten zu erhalten. Das Hinzufügen einer Klasse im laufenden Betrieb ist jedoch wahrscheinlich besser, wie ein anderer Beantworter beschrieben hat.
Wenn Sie es jedoch nicht sofort ändern müssen, empfehle ich die Verwendung von einfachem CSS, da es schneller ist und kein Benutzer Javascript aktivieren muss.
Tags und Links javascript html jquery css dynamic-css