hover / mouseover / verhalten / formatierung
waendu
- css
0 Gunnar Bittersmann0 Take0 Matthias Apsel0 waendu0 Matthias Apsel0 waendu
Guten Tag
Nachdem ich mit Google relativ lang nach einer Lösung gesucht habe, wende ich mich nun an euch.
Mit meiner Website habe ich zwei Probleme:
1. Grundsätzlich habe ich links das Menu und rechts den Inhalt. Unter "Architektur" habe ich im Menu vier Links und in Inhalt je ein Bild zu jedem Link. Ich möchte nun, dass wenn ich mit der Maus über ein Bild gehe, der entsprechende Link markiert wird (gleich wie wenn ich mit der Maus direkt über den Link gehe). Ich habe bereits Lösungen gefunden, für Bild und Link im selben Container - sind sie in meinem Fall aber nicht.
Ein Beispiel für wie ich das gerne möchte seht ihr hier.
2. Da ich für a:hover ein grauer Hintergrund eingestellt habe (im Stylesheet), wird jetzt im Firefox - wenn man mit der Maus über die Bilder geht - auch ein grauer Hintergrund angezeigt. Wie krieg ich den denn weg?
Herzlichen Dank für Eure Hilfe!
@@waendu:
nuqneH
Ich habe bereits Lösungen gefunden, für Bild und Link im selben Container - sind sie in meinem Fall aber nicht.
Dann mit JavaScript, nicht mit CSS. Aber worin siehst du den Mehrwert für den Nutzer?
- Da ich für a:hover ein grauer Hintergrund eingestellt habe (im Stylesheet), wird jetzt im Firefox - wenn man mit der Maus über die Bilder geht - auch ein grauer Hintergrund angezeigt. Wie krieg ich den denn weg?
Nicht für 'img' margin angeben, sondern für 'a'. Und das Unterlängen-Problem lösen: vertical-align: botttom.
Qapla'
Hi,
Und das Unterlängen-Problem lösen: vertical-align: botttom.
Bei Dir hat das bottom eher ein Überlängen- als ein Unterlängen-Problem ...
cu,
Andreas
@@waendu:
nuqneH
Ich habe bereits Lösungen gefunden, für Bild und Link im selben Container - sind sie in meinem Fall aber nicht.
Dann mit JavaScript, nicht mit CSS. Aber worin siehst du den Mehrwert für den Nutzer?
Naja der Nutzer sieht dann, welches Bild zu welchem Projekt gehört. die Bilder habe ich nicht beschriftet... da ich JavaScript nicht verstehe, lasse ich es aber wohl sein :)
- Da ich für a:hover ein grauer Hintergrund eingestellt habe (im Stylesheet), wird jetzt im Firefox - wenn man mit der Maus über die Bilder geht - auch ein grauer Hintergrund angezeigt. Wie krieg ich den denn weg?
Nicht für 'img' margin angeben, sondern für 'a'. Und das Unterlängen-Problem lösen: vertical-align: botttom.
kein margim für "img" - das verstehe ich. aber was ist "a"? kannst du mir dies bitte genauer erklären? Sorry aber ich bin Anfänger :)
Qapla'
Am liebsten möchte ich einfach ein zweites a:hover erstellen. Nur wie kann ich das machen? Wie muss der Name sein (a.zwei:hover) und wie kann ich dann auswählen, dass dieser und nicht der normale auf ein Objekt angewendet wird?
Merci!
@@waendu:
nuqneH
kein margim für "img" - das verstehe ich. aber was ist "a"?
Der Selektor für Elemente des Typs 'a' (Links).
Qapla'
Moin,
Guten Tag
Nachdem ich mit Google relativ lang nach einer Lösung gesucht habe, wende ich mich nun an euch.
Mit meiner Website habe ich zwei Probleme:
- Grundsätzlich habe ich links das Menu und rechts den Inhalt. Unter "Architektur" habe ich im Menu vier Links und in Inhalt je ein Bild zu jedem Link. Ich möchte nun, dass wenn ich mit der Maus über ein Bild gehe, der entsprechende Link markiert wird (gleich wie wenn ich mit der Maus direkt über den Link gehe). Ich habe bereits Lösungen gefunden, für Bild und Link im selben Container - sind sie in meinem Fall aber nicht.
Erstmal machst du aus den Menüs http://de.selfhtml.org/css/layouts/navigationsleisten.htm@title=Listen.
Ein Beispiel für wie ich das gerne möchte seht ihr hier.
Dieses Beispiel arbeitet mit JavaScript. Mit reinem CSS wirst du das bei dieser Seitenaufteilung nicht hinkriegen.
- Da ich für a:hover ein grauer Hintergrund eingestellt habe (im Stylesheet), wird jetzt im Firefox - wenn man mit der Maus über die Bilder geht - auch ein grauer Hintergrund angezeigt. Wie krieg ich den denn weg?
Dieses Problem taucht häufiger auf, um eine Klasse für Links mit Bildern drin wirst du nicht herumkommen, mit CSS kann man (ja leider) nicht rück-/aufwärts selektieren.
Herzlichen Dank für Eure Hilfe!
Gruß,
Take
@@Take:
nuqneH
um eine Klasse für Links mit Bildern drin wirst du nicht herumkommen,
Aber natürlich kommt es da drumherum.
mit CSS kann man (ja leider) nicht rück-/aufwärts selektieren.
Aber abwärts. Die Bilder sind allesamt Nachfahren des Elements mit der ID "content_uebersicht".
Qapla'
Moin,
@@Take:
nuqneH
um eine Klasse für Links mit Bildern drin wirst du nicht herumkommen,
Aber natürlich kommt es da drumherum.
Es?
mit CSS kann man (ja leider) nicht rück-/aufwärts selektieren.
Aber abwärts. Die Bilder sind allesamt Nachfahren des Elements mit der ID "content_uebersicht".
Ok, ich gebe zu, ich habe das jetzt nicht auf seine spezielle Seite bezogen. Aber was, wenn er jetzt irgendwann einmal auch Text auf der rechten Seite verlinken will?
Qapla'
Gruß,
Take
@@Take:
nuqneH
um eine Klasse für Links mit Bildern drin wirst du nicht herumkommen,
Aber natürlich kommt es da drumherum.
Ich bin männlich :)
mit CSS kann man (ja leider) nicht rück-/aufwärts selektieren.
Aber abwärts. Die Bilder sind allesamt Nachfahren des Elements mit der ID "content_uebersicht".
Kannst du mir bitte erklären, was genau ich machen muss? Merci!
Qapla'
@@waendu:
nuqneH
Aber abwärts. Die Bilder sind allesamt Nachfahren des Elements mit der ID "content_uebersicht".
Kannst du mir bitte erklären, was genau ich machen muss? Merci!
Selektoren für Nachfahren verwenden. [CSS2 §5.5, http://de.selfhtml.org/css/formate/zentrale.htm#verschachtelte_elemente@title=SELFHTML]
Qapla'
Om nah hoo pez nyeetz, waendu!
Deinen Postings entnehme ich zweierlei:
#1# du hast im Wesentlichen überhaupt keine Ahnung
#2# du lässt dir deine Website von irgendeinem Editor erstellen, wahrscheinlich NFO.
Jetzt gibt es für dich folgende Möglichkeiten:
#1# du hast aus irgendwelchen Gründen nicht die Möglichkeit, dich selbst damit zu beschäftigen. Dann bleibt dir nur die Hilfe-Funktion deines WYSIWIG-Editors zu bemühen oder jemanden zu bitten die gewünschten Änderungen für dich vorzunhmen.
#2# du möchtest lernen, wie man selbst ordentliche Internetseiten erstellt. Dann beschäftige dich mit den Grundlagen. Hier wirst du immer Leute finden, die dich auf diesem Weg unterstützen. Die Antworten die du bisher bekommen hast zeigen das. Sie überfordern dich zwar im Moment, was aber daran liegt, dass du dich bisher mit der Materie noch nicht beschäftigt hast.
Stell dir vor, du hast eine Frage zur Bruchrechnung und kannst aber mit den natürlichen Zahlen noch nicht umgehen.
Stell dir vor, du hast eine Frage zur Rechtschreibung, kennst aber noch gar nicht alle Buchstaben.
Kopf hoch!
Matthias
Om nah hoo pez nyeetz, waendu!
Deinen Postings entnehme ich zweierlei:
#1# du hast im Wesentlichen überhaupt keine Ahnung
#2# du lässt dir deine Website von irgendeinem Editor erstellen, wahrscheinlich NFO.
Was ist NFO? Habe die Website mit Dreamweaver erstellt ...
Jetzt gibt es für dich folgende Möglichkeiten:
#1# du hast aus irgendwelchen Gründen nicht die Möglichkeit, dich selbst damit zu beschäftigen. Dann bleibt dir nur die Hilfe-Funktion deines WYSIWIG-Editors zu bemühen oder jemanden zu bitten die gewünschten Änderungen für dich vorzunhmen.
#2# du möchtest lernen, wie man selbst ordentliche Internetseiten erstellt. Dann beschäftige dich mit den Grundlagen. Hier wirst du immer Leute finden, die dich auf diesem Weg unterstützen. Die Antworten die du bisher bekommen hast zeigen das. Sie überfordern dich zwar im Moment, was aber daran liegt, dass du dich bisher mit der Materie noch nicht beschäftigt hast.
Stell dir vor, du hast eine Frage zur Bruchrechnung und kannst aber mit den natürlichen Zahlen noch nicht umgehen.
Stell dir vor, du hast eine Frage zur Rechtschreibung, kennst aber noch gar nicht alle Buchstaben.
Kopf hoch!
Matthias
Konnte das Problem mit "vertical-align: botttom" lösen ...
Om nah hoo pez nyeetz, waendu!
#2# du lässt dir deine Website von irgendeinem Editor erstellen, wahrscheinlich NFO.
Was ist NFO? Habe die Website mit Dreamweaver erstellt ...
Net Fusion Objects ;-) Richtig wäre allerdings NOF NetObjects Fusion.
Matthias
Hi,
Konnte das Problem mit "vertical-align: botttom" lösen ...
Zu viel Tee ...
cu,
Andreas