Gunnar Bittersmann: X auf Bild bei Hover

Beitrag lesen

@@Henry

ist das so? Da muss ich den Screenshot wohl doch nochmal posten:

Ich weiß immer noch nicht, was du mir damit sagen willst.

Beim Hovern übers Bild...?

Genau gemommen übers li-Element. Mit CSS kann man aber dafür sorgen, dass die Box des li-Elements genauso groß wie das Bild ist.

Stört es dich, dass die Buttons nicht auf dem jeweiligen Bild liegen? Mit CSS kann man dafür sorgen, dass sie das tun. Ich hatte doch geschrieben, dass es gar nicht meine Absicht war, die Buttons zu stylen/positionieren. Das hattest du doch schon gemacht.

Meine Absicht war, deinen (und Matthias’) Fehler zu korrigieren und das Ganze tastaturbedienbar zu machen. Genau das sollte mein CodePen demonstrieren.

Oder meinstest du mit dem Screenshot, dass bei Touchscreens bei Tap ein Hover simuliert wird? Das ist auch gut so, sonst würden die Buttons ja dort nicht angezeigt werden.

Wie gesagt, Bild als Button, wäre da meiner Meinung nach sinnvoller gewesen

Tja, die Konversation hätte ja auch so verlaufen können:

„Ich habe da eben mal was gebastelt.“
„Geht nicht. Nicht mit Tastatur.“
„Oh. Aber wie geht’s mit Tastatur?“
„Die Buttons nur visuell verstecken (also nicht per display: none). Die Buttons werden angezeigt, wenn sie den Fokus haben oder wenn über das Vorfahrenelement gehovert wird.“
„Ah, verstehe. Aber hömmal, wäre es nicht sinnvoll, das Bild mit in den Button zu packen? Dann muss man mit der Maus nicht auf das X (Kreuz ×, ✖︎, ❌) zielen.“

Da hätte ich kaum widersprechen können.

LLAP 🖖

--
“When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory
0 75

X auf Bild bei Hover

Sophie
  • css
  • html
  1. 0
    TS
    • css
    • html
    • https
    1. 0
      Sophie
      1. 0
        TS
      2. 1
        Rolf b
        1. 0
          Sophie
          • css
          • html
          • php
          1. 1
            Rolf b
            1. 0
              Sophie
              1. 1
                Rolf b
                1. 1
                  Gunnar Bittersmann
                2. 0
                  Gunnar Bittersmann
              2. 0
                TS
                • html
                • php
                • sicherheit
              3. 0
                TS
              4. 2
                Robert B.
                • html
                • php
                • sicherheit
  2. -1
    Matthias Apsel
    1. 0
      Gunnar Bittersmann
  3. 0
    Henry
    • css
    • html
    • php
    1. 0
      Sophie
      1. 0
        Henry
        1. 0
          Henry
          1. 0
            TS
          2. 3
            Robert B.
      2. 0
        Gunnar Bittersmann
    2. 0
      TS
    3. 0
      Gunnar Bittersmann
      1. 0

        Warum redest du immer alles schlecht?

        Sophie
        • meinung
        1. 1
          Gunnar Bittersmann
          1. 0
            Sophie
      2. 0
        Henry
        1. 0
          Sophie
        2. 0
          Gunnar Bittersmann
          1. 1
            Tabellenkalk
            • ergonomie
            • ergonomie
        3. 1
          TS
          1. 0
            Henry
          2. 0
            Gunnar Bittersmann
            1. 1
              dedlfix
              1. 0
                Gunnar Bittersmann
                1. 0
                  dedlfix
                  1. 0
                    Gunnar Bittersmann
              2. 0
                Tabellenkalk
                1. 0
                  TS
            2. 1
              TS
              1. 0
                Gunnar Bittersmann
                1. 0
                  TS
                  1. 0
                    Gunnar Bittersmann
                    1. 0
                      TS
                      • projekt
              2. 0
                Henry
                • menschelei
                • sonstiges
                • zu diesem forum
                • zu diesem forum
                1. 0
                  TS
                  • menschelei
                  • zu diesem forum
                  • zu diesem forum
                2. 1
                  Gunnar Bittersmann
                  • zu diesem forum
                  1. 0
                    Henry
                    1. 0
                      Gunnar Bittersmann
                      1. 0
                        Henry
                        • menschelei
                        • zu diesem forum
                        1. 1
                          Gunnar Bittersmann
                          1. 0
                            Henry
                            1. 0
                              Henry
                            2. 0
                              Rolf b
                            3. 1
                              Gunnar Bittersmann
      3. 0
        TS
        • barrierefreiheit
        • menschelei
        • projekt
        1. 0
          Gunnar Bittersmann
          1. 0
            TS
            1. 0
              Gunnar Bittersmann
              1. 0
                TS
                • menschelei
    4. 2
      Martl
      1. 0
        TS
      2. 0
        Gunnar Bittersmann
        1. 0
          Martl
          1. 0
            Gunnar Bittersmann
            1. 2
              Martl
    5. 1
      Gunnar Bittersmann
      • html
    6. 0
      Gunnar Bittersmann
      • css
      • html
  4. 2
    Gunnar Bittersmann
  5. 0
    pl
    • css
    • design
    • html
  6. 0
    Malcolm Beck`s
    1. 0
      Sophie
      1. 1
        Rolf b