mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Mo 05.12.2016 03:43 Benutzername: Passwort: Auto-Login

Thema: list-style-image bei mouseover austauschbar? vom 10.02.2005


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Tipps & Tricks für Nonprint -> list-style-image bei mouseover austauschbar?
Seite: 1, 2  Weiter
Autor Nachricht
mcbethy
Threadersteller

Dabei seit: 02.12.2002
Ort: Hamburg
Alter: 33
Geschlecht: Weiblich
Verfasst Do 10.02.2005 15:03
Titel

list-style-image bei mouseover austauschbar?

Antworten mit Zitat Zum Seitenanfang

Hallo zusammen,
ich brauche mal wieder Hilfe. Mädchen!
Gerade sitze ich an der Umsetzung einer Mini-Seite und mir war danach, alles mit CSS zu realisieren.
Nur dumm, dass ich noch nicht so der Burner bin und an diesem blöden Mouseover-Effekt scheitere.

Link zur Testseite. (Alle Stylesheets sind in diesem Dokument)

Per list-style-image habe ich jedem Punkt ein eigenes Listenbild zugewiesen. Bis dahin kein Problem.
Nun wollte ich jedem auf die gleiche Weise ein Bild für den a:hover Zustand zuweisen. Aber das geht irgendwie nicht.
Ich hatte angenommen, dass es so klappen könnte:

Code:

.liste#aktuell{
list-style-image:url(../images/navi/aktuell.gif);
}

.liste#aktuell a{
list-style-image:url(../images/navi/aktuell.gif);
}

.liste#aktuell a:hover{
list-style-image:url(../images/navi/aktuell_hi.gif);
}


Doch mit der Annahme lag ich falsch. Habe ich einen Fehler gemacht oder geht das vielleicht auch gar nicht und ich habe die Arbeit umsonst gemacht? Menno!

Büdde helft mir.
  View user's profile Private Nachricht senden
beeviZ

Dabei seit: 30.09.2002
Ort: Dortmund
Alter: 23
Geschlecht: Männlich
Verfasst Do 10.02.2005 15:44
Titel

Antworten mit Zitat Zum Seitenanfang

du weist in deinem Beispiel ja dem Link das List-style-image zu.

Mit
.liste #aktuell:hover {...}
könnts funktionieren, allerdings Firefox da der IE :hover nur bei Links unterstützt.

Du könntest auch

<li><a href="#" id="aktuell"></a></li>

machen, und dann

li a#aktuell {display:block; height: 100%; background: url(...); padding-left: 30px;}
li a#aktuell:hover {background: url();}

das sollte definitiv funktionieren.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
mcbethy
Threadersteller

Dabei seit: 02.12.2002
Ort: Hamburg
Alter: 33
Geschlecht: Weiblich
Verfasst Do 10.02.2005 16:03
Titel

Antworten mit Zitat Zum Seitenanfang

Ah, danke für die Hilfe. Ich hab's.
Der Hund lag nur ganz wo anders begraben: Ich musste das a vor hover entfernen. Dann klappt es!

//edit

Verflucht! Ich sollte auch im IE testen, ehe ich in Jubel ausbreche. Es hätte so einfach sein können. *hu hu huu*
Aber eigentlich hast du es ja selbst geschrieben. Der IE packt es nicht.


Zuletzt bearbeitet von mcbethy am Do 10.02.2005 16:04, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
beeviZ

Dabei seit: 30.09.2002
Ort: Dortmund
Alter: 23
Geschlecht: Männlich
Verfasst Do 10.02.2005 16:23
Titel

Antworten mit Zitat Zum Seitenanfang

Machs mit der li a + background: url(); -Methode. Dann gehts.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
mcbethy
Threadersteller

Dabei seit: 02.12.2002
Ort: Hamburg
Alter: 33
Geschlecht: Weiblich
Verfasst Do 10.02.2005 16:36
Titel

Antworten mit Zitat Zum Seitenanfang

Das funktioniert zwar, aber wie lässt sich der Text ("Aktuell") unten an der Grafik ausrichten?
Mit padding und margin geht es nicht.
  View user's profile Private Nachricht senden
shaly

Dabei seit: 19.11.2002
Ort: -
Alter: -
Geschlecht: Weiblich
Verfasst Do 10.02.2005 16:36
Titel

Antworten mit Zitat Zum Seitenanfang

wenn du display:block machst, sollte das gehen.
  View user's profile Private Nachricht senden
mcbethy
Threadersteller

Dabei seit: 02.12.2002
Ort: Hamburg
Alter: 33
Geschlecht: Weiblich
Verfasst Do 10.02.2005 16:51
Titel

Antworten mit Zitat Zum Seitenanfang

Danke shaly.
Es gibt mit dieser Lösung leider extreme Darstellungsunterschiede zwischen den Browsern.
Hoffentlich bekomme ich das auch noch in den Griff. *seufz*
  View user's profile Private Nachricht senden
shaly

Dabei seit: 19.11.2002
Ort: -
Alter: -
Geschlecht: Weiblich
Verfasst Do 10.02.2005 17:00
Titel

Antworten mit Zitat Zum Seitenanfang

google mal nach dem boxmodel-hack. der ie interpretiert margin und padding anders als vorgesehen.
  View user's profile Private Nachricht senden
 
Ähnliche Themen css, ie6, list-style-image...
CSS Aufzählung list-style-image
[css] list-style-image - vertikal ausrichten
[CSS]Hilfe! Warum kein Border um list-style-image?
css list-style-position
CSS: List-image nur bei Hauptmenüpunkten
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2  Weiter
MGi Foren-Übersicht -> Tipps & Tricks für Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.