Meine Entschuldigungen im Voraus, da dies ein Problem bezüglich des grundlegenden Verständnisses von CSS und vielleicht auch von Javascript zu sein scheint.
Was ich tun möchte, ist folgendes: Stellen Sie sich ein Div vor, das ein h3 und ein p enthält. Beim Schweben auf dem Div möchte ich, dass die h3 und p ihr Schriftgewicht ändern. Bisher verwende ich diesen Code hier, um die Deckkraft zu ändern und den Schwebezustand über dem div zu begrenzen, aber ich weiß wirklich nicht, wie ich auf die zwei Elemente im div verweisen kann. Es tut mir wirklich leid, aber ich brauche jemanden, der es mir in sehr einfachen Worten erklärt.
Zum Beispiel denke ich, dass diese Elemente innerhalb des divs Kinder heißen, aber ich bin mir nicht einmal sicher ... Ich arbeite zum ersten Mal wirklich mit all dem HTML / CSS / Java-Zeug und versuche es Dinge herausfinden, während ich mitfahre. Die Tutorial-Seiten, die ich bisher gefunden habe, konnten mein Problem nicht lösen, daher dieser Beitrag.
Weitere Hintergrundinformationen: Ich benutze das "smoothgallery" -Script von jondesign (Jonathan Schemoul) () und versuche mich zu verbiegen Es ist mein Wille, aber das ist ziemlich schwierig, wenn Sie keine Ahnung haben, wie es tatsächlich funktioniert. Die Seite, auf der ich das Skript implementiert habe, kann hier gefunden werden.
Hier kommt der CSS-Teil, der das Div bei Hover ändert:
%Vor%Dieser Eintrag in der CSS-Datei ändert die Einstellungen für z.B. das h3 innerhalb dieses div,
%Vor%Sie können auch die .js-Datei ansehen, die diese Klassen erstellt. Sie finden sie hier .
Dies ist wahrscheinlich der wichtigste Teil hier:
%Vor%Also meine Frage hier ist, wenn es überhaupt möglich ist, die h3 und p Einstellungen zu ändern, indem Sie die Hover-Funktion auf dem Haupt div?
Vielen Dank im Voraus! Auch bei negativer Kritik weiß ich nicht, ob ich etwas falsch gemacht habe, als ich diese Frage gestellt habe und ob ich es hier überhaupt fragen kann.
Sie machen diesen Weg komplizierter, als er sein muss. Hierfür ist kein Javascript erforderlich. Nehmen wir an, Sie haben Folgendes:
%Vor%Sie haben also einen Container mit Kopfzeile und Absatz. Nehmen wir an, Sie möchten das Kopfgewicht normal und den roten Absatz normalerweise mit einer gepolsterten Kiste um das Ganze herum haben. Hier sind Ihre Stile:
%Vor% Wenn Sie den Mauszeiger über die Schaltfläche bewegen, möchten Sie, dass der Absatz und die Überschrift fett und der Rahmen blau angezeigt wird. Fügen Sie dieses in Ihr Stylesheet (oder <style> block) unterhalb des obigen CSS ein:
Beachten Sie, dass Sie etwas Platz sparen und es übersichtlicher gestalten können, indem Sie die Stile <h3> und <p> in einer Zeile mit einem Komma kombinieren, da sie beide gleich sind. Das Ganze würde jetzt so aussehen:
Denken Sie daran, dass das "C" in "CSS" für "Kaskadierung" steht: Stile durchlaufen beide Hierarchien (dh der Stil eines übergeordneten Elements gilt auch für ein untergeordnetes Element, es sei denn, es verfügt über Standardstile wie Ränder oder was auch immer) , und nach unten das Stylesheet - das bedeutet Styles, die Sie definieren, nachdem andere sie überschreiben, wenn sie auf dasselbe Element angewendet werden.
Der Selektor ": hover" in CSS kann mit fast allen Ausnahmen verwendet werden. Ich benutze sie regelmäßig für Javascript-freie Drop-Down-Menüs. Weitere Informationen zum CSS-Selektor ": hover" finden Sie hier: W3Schools CSS-Referenz auf ": hover" . Tatsächlich ist die W3Schools-Seite eine großartige Ressource zum Aufräumen Ihres CSS.