background-image lädt immer neu - IE

[Mike]

Hallo

Habe ein eigenartiges Problem... Ich habe im Stil von http://aktuell.de.selfhtml.org/artikel/css/mouseover/index.htm#a4 ein Menu kreiert, das auch wunderbar funktioniert, solange man in der Seite navigiert. Wird per target=blank aus der aktuellen Seite ein neues Fenster geöffnet und dieses dann wieder geschlossen, flackern nun die Menupunkte beim ersten Drüberfahren, sprich das Hintergrundbild verschwindet kurz, als würde es beim Aufrufen wieder neu geladen.

Das Ganze natürlich nur im IE... bei Standard-Einstellungen.

Mein Code:

.titback, .titback:link, .titback:visited, .titback:active { display:block; margin-left:17px; padding:3px 0 0 12px; background-image:url(../images/menunorm.gif); background-repeat:no-repeat; width:161px; height:17px; color:#676cb6; font-size:12px; font-weight:bold; text-decoration:none }  
  
.titback:hover { background-image:url(../images/menunorm1.gif); color:#676cb6; font-size:12px; font-weight:bold; text-decoration:none }

oder auch (sogar ohne hover-Effekt...)

.lk2, .lk2:link, .lk2:visited, .lk2:active { display:block; padding:4px 0 0 25px; background-image:url(../images/menutop_02.gif); background-repeat:no-repeat; width:48px; height:23px; color:#ffffff; font-size:11px; font-weight:bold; text-decoration:none; float:left }  
  
.lk2:hover { color:#d71918; font-size:11px; font-weight:bold; text-decoration:none }

Danke für Hinweise und Grüsse
Mike

[Olaf Schneider]

Hallo Mike,

der (oder ein) Trick ist es, ein doppelt so großes Bild zu verwenden, welches sowohl den Standardbackground als auch den Hoverbackground enthält. Bei :hover wird dann lediglich die Position des Backgrounds geändert.

Ein Tutorial und Beispiel findet man beispielsweise unter http://www.ibloomstudios.com/article3/

Gruß
Olaf

[Mike]

Hallo Olaf

Dazu hatte ich was ähnliches im Archiv gefunden, war mir aber überhaupt nicht siche, ob dies das Problem umgehen würde.
Dann versuche ich das also trotzdem!

Danke erstmal und Gruss
Mike

[Mike]

Ne, auch das hilft nicht, das Phänomen tritt weiterhin auf :-(

Gruss
Mike

[Olaf Schneider]

Hallo Mike,

Ne, auch das hilft nicht, das Phänomen tritt weiterhin auf :-(

Hm, seltsam. Postest Du mal den relevanten Teil des css’?

Gruß
Olaf

[Mike]

.titback, .titback:link, .titback:visited, .titback:active { display:block; margin-left:17px; padding:3px 0 0 12px; background-image:url(../images/menunorm.gif); background-repeat:no-repeat; width:161px; height:17px; color:#676cb6; font-size:12px; font-weight:bold; text-decoration:none }  
*html .titback, .titback:link, .titback:visited, .titback:active { width:173px; height:20px }  
.titback:hover { background-image:url(../images/menunorm1.gif); color:#676cb6; font-size:12px; font-weight:bold; text-decoration:none }  
.titback1, .titback1:link, .titback1:visited, .titback1:active { display:block; margin-left:17px; padding:3px 0 0 12px; background-image:url(../images/menubottom.gif); background-repeat:no-repeat; width:161px; height:25px; color:#676cb6; font-size:12px; font-weight:bold; text-decoration:none }  
*html .titback1, .titback1:link, .titback1:visited, .titback1:active { width:173px; height:20px }  
.titback1:hover { background-image:url(../images/menubottom1.gif); color:#676cb6; font-size:12px; font-weight:bold; text-decoration:none }  

Dann im body

...  
<a href="gallerie.php" class="titback">GALLERIE</a>  
<a href="guestbook.php" class="titback">GÄSTEBUCH</a>  
<a href="links.php" class="titback1">LINKS</a>  
...

[Olaf Schneider]

Hallo Mike,

kann es sein, dass Du nicht die aktuelle Version gepostet hast? In dem geposteten css arbeitest Du nach wie vor mit Auswechseln der Bildreferenzen per css, anstatt bei :hover mit background-position die Position des Hintergrundbildes zu verändern.

Gruß
Olaf

[Mike]

Ach so... naja, hab ich gleich verworfen, da es nichts gebracht hat. War folgendermassen:

.titback, .titback:link, .titback:visited, .titback:active { display:block; margin-left:17px; padding:3px 0 0 12px; background:url(../images/menunorm.gif) 0 0 no-repeat; width:161px; height:17px; color:#676cb6; font-size:12px; font-weight:bold; text-decoration:none }  
  
.titback:hover { background:url(../images/menunorm1.gif) -161px 0 no-repeat; color:#676cb6; font-size:12px; font-weight:bold; text-decoration:none }  

Hab es auch nach "ibloomstudios" probiert, ebenfalls keine Veränderung

Gruss
Mike

[MudGuard]

Hi,

Ach so... naja, hab ich gleich verworfen, da es nichts gebracht hat. War folgendermassen:

background:url(../images/menunorm.gif) 0 0 no-repeat;
background:url(../images/menunorm1.gif) -161px 0 no-repeat;

Du solltest ja auch _NICHT_ 2 verschiedene Bilder nutzen, sondern nur _EIN_ Bild.

cu,
Andreas

[Mike]

Hi,

background:url(../images/menunorm.gif) 0 0 no-repeat;
background:url(../images/menunorm1.gif) -161px 0 no-repeat;

Du solltest ja auch _NICHT_ 2 verschiedene Bilder nutzen, sondern nur _EIN_ Bild.

I'm sorry, tippfehler da nachträglich nochmals gepostet... als ich es ausprobiert hatte, war es richtig...

und ps. ich habe natürlich die Formatierungen für die Postings gefunden (links, etc.)... bin etwas von der Rolle ;-)

Gruss
Mike

[Mike]

Eigentlich bin ich ja doof... http://www.ehcb-spirit.ch/ und CSS unter css/default.css (wie mache ich im Forum links??). IE im quirks, da ich die Unterschiede von 5.x zu 6 satt habe (padding).

Also nochmal zusammengefasst: Rumsurfen auf der Seite, kein Problem, F5 aktualisieren, kein Problem, zum Beispiel auf den Banner "bully-goal" unten rechts klicken, das sich soeben geöffnete Fenster wieder schliessen und nun über die Menus links und oben fahren -> beschriebenes Problem...

Gruss
Mike

[Cybaer]

Hi,

Habe ein eigenartiges Problem...

Nein, ist beim IE der "normale Wahnsinn".

Wenn das Caching-Verhalten des IEs entsprechend "scharf" eingestellt ist, dann holt der IE in diesem Fall jedesmal die Grafik neu - auch wenn es sich um eine große Grafik handelt, die nur neu positioniert wird.

Du könntest höchstens noch versuchen, der Grafik bei der Auslieferung einen Expires-Header bzw. sonstige Cache-Header mit auf den Weg zu geben ...

... oder die User bitten, ihre IEs besser zu konfigurieren. ;-)

Gruß, Cybaer

[Mike]

Hallo Cybaer

Jaja der IE, NERV... ;-)

Also bei mir ist ja das Caching auf automatisch eingestellt, daher sollte das ja bei mir nicht passieren. Wenn anders eingestellt ist natürlich klar.

Danke für die Hinweise und Grüsse
Mike