Boki: Hover-Effekt durch CSS - Grafikprobleme im IE

Hallo Forum,

auf http://www.bonnerkinemathek.de/programm/ gibt es ein grafisches Menü links oben, das CSS für einen Grafiktausch bei Mouseover benutzt. Allerdings zeigen einige aber nicht alle Systeme mit IE 6 den folgenden Grafikfehler:

Beim bewegen der Maus über die vier Tasten des Menüs wird zwar die Grafik hin und her getauscht, aber kurz vor dem Tausch erscheint für sehr kurze Zeit ein Teil des Hintergrundes des Frames darunter (Untermenü), was sehr störend wirkt. Der Effekt ist nicht auf allen Systemen reproduzierbar.

Hat jemand eine Idee, um das Problem einzugrenzen???

Danke im Voraus von

Boki

  1. Hallo,

    Hat jemand eine Idee, um das Problem einzugrenzen???

    Der IE lädt bei CSS-Hovereffekten die Bilder immer komplett neu vom Server - was zu dieser Verzögerung führt. Es gibt keine direkte Möglichkeit, das zu unterbinden.

    Unter bspw. < http://wellstyled.com/css-nopreload-rollovers.html> gibt es einen Lösungsvorschlag für das Problem.

    Viele Grüße,
    Christian

    1. Danke für die schnelle Hilfe! Der Ansatz von wellstyled.com scheint mir wirklich genial.

      Ob es wohl hilft. Die Hover-Grafiken in 1x1 Pixel irgendwo abzubilden, um sie in den Cache zu befördern?

      Auch frage ich mich, warum der Grafikfehler nicht bei allen Systemen mit IE 6 reproduzierbar ist. Bei Manchen Rechnern im selben Netzwerk klappte alles wunderbar beim Testen.

      Der IE lädt bei CSS-Hovereffekten die Bilder immer komplett neu vom Server - was zu dieser Verzögerung führt. Es gibt keine direkte Möglichkeit, das zu unterbinden.

      Unter bspw. http://wellstyled.com/css-nopreload-rollovers.html gibt es einen Lösungsvorschlag für das Problem.

    2. Hallo Christian,

      Der IE lädt bei CSS-Hovereffekten die Bilder immer komplett neu vom Server - was zu dieser Verzögerung führt. Es gibt keine direkte Möglichkeit, das zu unterbinden.

      Unter bspw. http://wellstyled.com/css-nopreload-rollovers.html gibt es einen Lösungsvorschlag für das Problem.

      Also bei mir flackert der Hovereffekt mit Wechsel der Position ein und desselben Hintergrundbildes im IE mehr als der klassische Hovereffekt mit Wechsel des Bildes als solchem.

      Aber das scheint je nach Betriebssystem unterschiedlich zu sein:

      http://forum.de.selfhtml.org/archiv/2005/8/t113891/#m724855

      Gruß Gernot

      1. Hallo Gernot,

        Also bei mir flackert der Hovereffekt mit Wechsel der Position ein und desselben Hintergrundbildes im IE mehr als der klassische Hovereffekt mit Wechsel des Bildes als solchem.

        Darf ich mal raten, wie Deine Cache-Einstellungen lauten...? ;-)

        Aber das scheint je nach Betriebssystem unterschiedlich zu sein:

        http://forum.de.selfhtml.org/archiv/2005/8/t113891/#m724855

        Nein, es hängt nicht vom Betriebssystem ab, sondern von den Cache-Einstellungen des IE. Aber wie Ingo schon sagte ist jeder selbst schuld, wenn er die ungeschickteste aller möglichen Einstellungen wählt... ;-)

        Viele Grüße
        Carsten

  2. Habe gerade gesehen, dass die Hintergrundgrafik im Ruhezustand doppelt definiert ist. Einmal im äußeren DIV und einmal beim Link selbst. Vielleicht hat das ja zum Problem beigetragen. Werde gleich mal testen, den Hintergrund im äußeren DIV weg zu lassen.

    Gruß
    Boki

  3. Hi,

    auf http://www.bonnerkinemathek.de/programm/ gibt es ein grafisches Menü links oben,

    Du meinst die (etwas seltsam anmutende ;-) Seite http://www.bonnerkinemathek.de/variabel/menu_1o.htm?
    Das ist ohnehin sehr übel gelöst. Wenn keine Grafiken angezeigt werden, ist kein Menü sichtbar.
    Wioe wäre es mit diesem Bildwechsel?

    freundliche Grüße
    Ingo

    1. Hallo Ingo,

      Du meinst die (etwas seltsam anmutende ;-) Seite http://www.bonnerkinemathek.de/variabel/menu_1o.htm?

      Ja, genau diesen Frame meine ich ;-) - die Anmutung ist sicherlich Geschmackssache, mir gefällt die Optik ;-) - Ich gebe Dir aber unbedingt recht, dass das Menü auch ohne Grafiken bedienbar sein muss. Da besteht noch Überarbeitungsbedarf.

      Die vorgeschlagene Lösung zum Bildtausch klingt sehr interessant. Ich werde sie mal testen und dann gleich einen Alternativtext für die Bilder hinzufügen, wodurch es dann auch ohne Bildchen bedienbar bleibt.

      Das ist ohnehin sehr übel gelöst. Wenn keine Grafiken angezeigt werden, ist kein Menü sichtbar.
      Wioe wäre es mit diesem Bildwechsel?

      Danke für Kritik und Hilfe

      Gruß
      Boki

      1. Wioe wäre es mit diesem Bildwechsel?

        Klappt bei mir auf einer Testseite, in IE flackert der Hintergrund allerdings immer noch kurz durch vor dem Wechsel und außerdem, wenn ich die Maus mehrmals sehr schnell über die Tasten bewege, beginnt der IE (und nur der) wie wild zu laden und die Knöpfe verwschwinden in dieser Phase beim Mouseover ganz. Das ist auch auf der oben genannten Beispielseite so.

        Hmmmmm ...

        Scheint so als würde IE nicht beide Grafiken im Cache halten.

        1. Hallo,

          Scheint so als würde IE nicht beide Grafiken im Cache halten.

          doch, das tut er schon (Beleg: Trenne die Internetverbindung oder wechsle in den Offline-Modus und versuch den Hover-Effekt nochmal. Er funktioniert immer noch).
          Nur fragt er bei jedem Bildwechsel "sicherheitshalber" mal schnell beim Server an, ob die Grafik auch *wirklich* noch aktuell ist. :-(

          So long,

          Martin

          1. Nur fragt er bei jedem Bildwechsel "sicherheitshalber" mal schnell beim Server an, ob die Grafik auch *wirklich* noch aktuell ist. :-(

            Und es scheint, er verschluckt sich dann, wenn ich die Maus sehr rasch hin und her über die Tasten jage.

            Kann ich dem IE irgendwie sagen, er soll nicht so oft nachsehen, ob die Grafik noch die gleiche ist?

            Gruß
            Boki

        2. Hi,

          Scheint so als würde IE nicht beide Grafiken im Cache halten.

          Das kann ich bei meiner Seite nicht nachvollziehen. Überprüfe doch mal Deine Interneteinstellungen und leere den Cache mal.

          freundliche Grüße
          Ingo

          1. Scheint so als würde IE nicht beide Grafiken im Cache halten.
            Das kann ich bei meiner Seite nicht nachvollziehen. Überprüfe doch mal Deine Interneteinstellungen und leere den Cache mal.

            Den Cache habe ich natürlich vor jedem Test geleert. Was genau sollte ich an den Interneteinstellungen überprüfen?

            Übrigens: Wenn ich die Seite lade und dann die Internetverbindung trenne und dann die Maus über die Grafik schiebe verschwindet die Grafik ganz und nur der Hintergrund ist zu sehen. Auf meiner und auf Deiner Seite. :-(

            IE 6 mit Cache-Überprüfung bei jedem Besuch der Seite (hier evtl besser auf 'Auto' wechseln oder? Sorry hab einen spanischen IE, ich weiß nicht wie die entsprechende Option in deutsch heißt...

            Gruß
            Boki
            mit zerrauftem Haupthaar ;-)

            1. Hi,

              IE 6 mit Cache-Überprüfung bei jedem Besuch der Seite (hier evtl besser auf 'Auto' wechseln oder? Sorry hab einen spanischen IE, ich weiß nicht wie die entsprechende Option in deutsch heißt...

              "Automatisch" ;-)
              Und ja, so habe ich das eingestellt und der IE lädt - zumindest bei meiner Methode - nichts nach und fragt auch nicht ständig beim Server, ob sich was geändert hat. Dies müßte auch die Voreinstellung sein.

              freundliche Grüße
              Ingo

              1. "Automatisch" ;-)
                Und ja, so habe ich das eingestellt und der IE lädt - zumindest bei meiner Methode - nichts nach und fragt auch nicht ständig beim Server, ob sich was geändert hat. Dies müßte auch die Voreinstellung sein.

                In Stellung Auto funktioniert es auch bei meiner ursprünglichen Version,  aber bisher habe ich das Problem bei so vielen IEs von Freunden gefunden, dass ich glaube, es gibt genügend Leute, die die Cache-Option _nicht_ auf auto haben, dass ich diesen Fall nicht ignorieren sollte. Das führt mich aber in das Dilemma: Nehme ich Deine Lösung, dann verschluckt sich der IE bei schnellen Mausbewegungen und die Tasten verschwinden oder lasse ich es bei meiner bisherigen Lösung, in der die Tasten nicht verschwinden aber ich das ganz oben bejammerte Aufflackern des Hintergrundes habe...

                Grüße von

                Boki

                1. Hi,

                  Das führt mich aber in das Dilemma: Nehme ich Deine Lösung, dann verschluckt sich der IE bei schnellen Mausbewegungen und die Tasten verschwinden oder lasse ich es bei meiner bisherigen Lösung, in der die Tasten nicht verschwinden aber ich das ganz oben bejammerte Aufflackern des Hintergrundes habe...

                  Nunja, wer den IE so ungünstig eingestellt hat, ist selbst schuld. Ich habe das mit dem "Verschlucken" mal ausprobiert - da muß man schon ganz schön mit der Maus agieren, damit das passiert. Aber der IE ist auch wirklich dumm, wenn er - obwohl er die Vorder- und Hintergrundgrafik geladen hat - beim Umschalten der visibility eine der beiden Grafiken neu laden will. Evtl. hilft es ja, das img 1px kleiner zu machen, so daß ein Teil der Hintergrundgrafik stets angezeigt werden muß?
                  Grundsätzlich würde ich aber meine Methode vorziehen, da sie ja noch andere Vorteile hat.

                  freundliche Grüße
                  Ingo

                  1. Hi Ingo,

                    Du hast Recht, der IE verhält sich hier recht sonderbar, eigentlich wird ja nur eine Grafik invisible, also kein Grund von einem 'neuen Seitenbesuch' auszugehen. Naja so isser halt. - Ich tendiere auch zu Deiner Lösung, sie ist elegant und logisch. Aber ich teste dann morgen weiter...

                    Gruß
                    Boki