Markus Trusk: Flackern bei Mouserover

Hola,
Ich habe bei Mozilla 1.5 bei mouseover/out Effekten ein lästiges Flackern und ich weiß nicht warum. Bei Opera und IE kommt das störende Flackern nicht vor, so wie es sein soll. Kann es sich jemand erklären?

-> http://testboard.acid4u.com/

P.S Wenn man mit der Maus am Button ein bißchen herumfährt, sieht man den Effekt.

Markus Trusk.

  1. Hallo,

    wenn Du diese komische Zeile mal aus Deinem CSS löscht:

    #blackline4[id] {position:fixed}

    dann geht's. Was soll die überhaupt bedeuten?

    Gruß, Andreas

    --
    <img src="http://was-ist-das.andreas-lindig.de/was_ist_das_fetzen.jpg" border="0" alt="">
    http://was-ist-das.andreas-lindig.de
    1. Hi,

      #blackline4[id] {position:fixed}
      dann geht's. Was soll die überhaupt bedeuten?

      Ich glaube nicht, dass es daran liegt, da ich es auf einer alten Version auch so gemacht habe. Diese Zeile muss sein, da der Internet Explorer zu blöd für position:fixed ist. Zuerst wird das Element auf position:absolute gesetzt und da der IE diese Zeilen

      #elementname[id] {position:fixed}

      ignoriert, zerschießt er auch nicht das Layout, was nänmlich passieren würde, wenn ich Elemente nur mit position:fixed positioniere. Browser, die position:fixed unterstützen lassen diese Element dann immer an der festen Position, auch beim Scrollen. (Später muss in noch einen z-index hinzufügen, damit der untere Teil nicht über die oberen Grafiken scrollt, aber soll ja nur mal ein erstes Layout sein)

      Markus Trusk.

      1. Hallo,

        #blackline4[id] {position:fixed}
        dann geht's. Was soll die überhaupt bedeuten?

        Ich glaube nicht, dass es daran liegt, da

        hat bei meinem Test nicht daran gelegen.

        Du kannst versuchen die onmouse (noch/nur?) auf das Div anzuwenden, was bei einem onclick="href='..;return...'" wohl hinreichend sauber wäre.

        Oder per CSS bei a:hover etwas zu bewirken (background?) statt per JavaScript, bei CSS scheint der Effekt nicht aufzutreten.

        Grüsse

        Cyx23

        1. Hallo,
          hmm offensichtlich sieht es so aus, als ob irgendwie in der horizontalen Mitte der Buttons ein Ein-Pixel breiter Bereich im mouseover/out Effekt nicht miteingeschlossen wird, aber ich versuche die ganze Zeit draufzukommen, bevor ich vielleicht größere Änderungen machen muss.

          Markus Trusk.

          1. Hi Markus,

            hmm offensichtlich sieht es so aus, als ob irgendwie in der horizontalen Mitte der Buttons ein Ein-Pixel breiter Bereich im mouseover/out Effekt nicht miteingeschlossen wird, aber ich versuche die ganze Zeit draufzukommen, bevor ich vielleicht größere Änderungen machen muss.

            Ich dachte zuerst, dass das Eventbubbling für diese Erscheinung verantwortlich ist, bin mir nun aber nicht mehr sicher.
            Als Test kannst du beim Mouseout mal einen Timeout definieren, wenn es am Eventbubbling liegt, müsste der Effekt dann verschwinden.
            onMouseout="window.setTimeout('changebutton(1,normal1)', 10);"
            Mir ist nämlich aufgefallen, dass der nichtsensitive Bereich keineswegs die ganze Zeilenbreite einnimmt, sondern nur auftritt, wenn die Maus darüberfährt oder darauf ruht. Bei einer waagrechten Seitwärtsbewegung wird sofort wieder umgeschaltet.
            Warum dieser Effekt aber innerhalb eines Bildes auftreten sollte, ist mir auch unklar. Teste es einfach mal.
            Ansonst bleibt mir nur die Erklärung, dass ihm an deinem CSS irgendeine Kombination nicht gefällt.

            Gruß

            Kurt

            --
            > Nein, ich beantworte keine Anfragen per e-mail.
            "Eifer ist Begeisterung, gemildert durch Vernunft."  (Blaise Pascal; fr. Mathematiker, Physiker u. Philiosoph; 1623-1662)
            http://elektro-dunzinger.at
            http://shop.elektro-dunzinger.at
            1. Morgen,
              also ich habe jetzt viele Kombinationen ausprobiert, einmal mit seTimeout, dann ohne Grafik, ohne position:fixed, aber selbst wenn ich die Grafik weglasse, sieht man die Linkschrift in der Statuszeile flackern, wenn der Link nur aus Text besteht, was wahrscheinlich bedeutet, dass am CSS etwas nicht stimmt, aber selbst da habe ich schon viele Variationen ausprobiert, wobei ich die selben CSS Eigenschaften und Javascript Funktionen auf meiner alten Seite bis jetzt noch problemlos ohne Flackern verwende.

              Markus Trusk.

              1. Hi Markus,

                Eine vage Möglichkeit fällt mir noch ein, kann diese aber nicht belegen.
                Ich hatte vor längerer Zeit einmal Probleme mit den Größenangaben bei absolut positionierten Divs, weiss aber nicht mehr genau, welcher Art die waren.
                Nimm mal die Größenangaben raus, vielleicht hilft es.
                Natürlich ist text-align dann auch überflüssig, was es aber auch so ist, da Grafik und div gleich groß sind.
                Ich kann bei diesem Phänomen nur mehr raten, eine wirklich begründbare Lösung fällt mir dazu nicht mehr ein.

                Gruß

                Kurt

                --
                > Nein, ich beantworte keine Anfragen per e-mail.
                "Was noch zu leisten ist, das bedenke, was du schon geleistet hast, das vergiss."  (Marie von Ebner-Eschenbach; oest. Schriftstellerin; 1830-1916)
                http://elektro-dunzinger.at
                http://shop.elektro-dunzinger.at
                1. Hallo,
                  also ich habe jetzt mal Zeile für Zeile auskommentiert, und nachgsehen ab wann dieser lästige Effekt beginnt. Die Verursacher sind die beiden CSS Angaben, die unmittelbar unterhalb der Links anfangen. Zum einen ist das der schwarze Balken. Die Links, die dann weiter unten beginnen, wo ich einen zur Probe mal hinpositioniert habe, werden auch durch den blauen Balken unmittelbar unterhalb dieser Links gestört, aber warum das genau damit zusammenhängt weiß ich noch nicht. Zumindest weiß ich schon mal, woran es liegt.

                  Markus Trusk.

                  1. Also ich habe jetzt ein bißchen herumschummeln müssen. Manche Grafiken habe ich automatisch mit schwarzen Balken gezeichnet, aber ich glaube den genauen Fehler gefunden zu haben: wenn ich line-height zu den CSS Eigenschaften dazuscheibe (was ich wg. dem IE mache, da dieser manchmal height falsch interpretiert) und in der nächsten Zeile

                    #elementname[id] {position:fixed}

                    schreibe, scheint das Mozilla wiederum nicht zu gefallen, wodurch dieser Effekt zustande kommt. Für den IE habe ich die font-size auf zB nur 7px gesetzt, wodurch in kein line-height brauche, und das Layout in allen Browsern gleich aussieht.

                    Markus Trusk.

      2. #blackline4[id] {position:fixed}
        dann geht's. Was soll die überhaupt bedeuten?

        Ich glaube nicht, dass es daran liegt, da ich es auf einer alten Version auch so gemacht habe.

        glauben ist nicht wissen! der Katholik glaubte bis vor kurzem, daß die Erde eine Scheibe sei. Und glaubt er nicht noch immer, daß Kinderkriegen ohne ficken und ohne Reagenzglasbefruchtung möglich ist? (siehe die unbefleckte Empfängnis).
        bei mir hat's funktioniert. Probier's doch mal aus :)
        Wenn man das entsprechendende Div aus der HTML-Datei löscht funktioniert es genauso. Scheint also daran zu liegen. Die Maus "schrappt" dadrüber.

        ...da der Internet Explorer zu blöd für position:fixed ist.

        Ich weiß. Dann gestaltet man im allgemeinen die Seite so, daß sie auf den nicht Standardkonformen Browsern auch irgendwie verträglich aussieht. Ein gutes Beispiel für position:fixed ist die Seite vom wahsaga:

        http://wazgnuks.net/
        (leider im Moment außer Betrieb)

        Gruß, Andreas

        --
        <img src="http://was-ist-das.andreas-lindig.de/was_ist_das_fetzen.jpg" border="0" alt="">
        http://was-ist-das.andreas-lindig.de
        1. Morgen,

          #blackline4[id] {position:fixed}
          bei mir hat's funktioniert. Probier's doch mal aus :)

          Also bei mir nicht, obwohl ich alle position:fixed herausgenommen habe.

          Markus Trusk.