[CSS] Verschwommene HDPI (2x) Grafiken in Absolut/Fixierten Elementen

Dieses Thema im Forum "Webdesign" wurde erstellt von Murdoc, 28. Juni 2013 .

  1. Diese Seite verwendet Cookies. Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies. Weitere Informationen
  1. #1 28. Juni 2013
    Zuletzt von einem Moderator bearbeitet: 15. April 2017
    Verschwommene HDPI (2x) Grafiken in Absolut/Fixierten Elementen

    Ich habe eine mobile UI erstellt und muss nun feststellen, dass 2x Grafiken als Hintergrund o.ä. im Android Stock Browser (teilweise) verschwommen dargestellt werden. Ich habe auch doppelt überprüft ob die 2x Grafiken auch geladen werden.

    Dieses Verhalten trifft im Grunde nur auf Elemente zu, die absolute/fixed/relative Positioniert wurden und/oder einen z-index Wert besitzen.

    Kennt jemand zufällig dieses Problem und weiß einen Workaround?
    Es handelt sich dabei nämlich sehr wahrscheinlich um einen Bug, denn Fennec und Chrome Mobile haben keinerlei Probleme.

    Fennec (Firefox für Android BETA)
    [​IMG]

    Android Stock Browser (und damit leider auch die zu Grunde liegende Engine des WebView):
    [​IMG]

    // ---------------------

    Copy & Paste aus Beitrag #3

    Ich hab hier mal zum testen ein Beispiel erstellt:

    http://murdoc.eu/hdpi-bug

    [​IMG]

    Zip zum Download:
    https://www.xup.in/dl,11961696/hdpi-bug.zip/

    Firefox läd das 2x Bild und zeigt es gestochen scharf an.
    Android Stock Browser läd auch das 2x Bild, zeigt es aber verschwommen an.
     

  2. Anzeige
  3. #2 28. Juni 2013
    Zuletzt von einem Moderator bearbeitet: 14. April 2017
  4. #3 28. Juni 2013
    Zuletzt von einem Moderator bearbeitet: 14. April 2017
    AW: Verschwommene HDPI (2x) Grafiken in Absolut/Fixierten Elementen

    Ich hab hier mal zum testen ein Beispiel erstellt:

    http://murdoc.eu/hdpi-bug

    [​IMG]

    Zip zum Download:
    https://www.xup.in/dl,11961696/hdpi-bug.zip/

    Firefox läd das 2x Bild und zeigt es gestochen scharf an.
    Android Stock Browser läd auch das 2x Bild, zeigt es aber verschwommen an.

    // -------------------------

    "Fehler" gefunden.

    Das Element mit dem Hintergrund darf nicht leer sein.
    Wenn ich Text reinschreibe wird der Hintergrund scharf dargestellt.

    Aber nur wenn der Text (theoretisch) sichtbar ist ...

    Der Workaround:
    Code:
    display: inline-block;
    font-size: 2pt; /* 1pt reicht nicht aus */
    color: transparent;
    Kann auch sein, dass das nur in Verbindung mit einem A-Element auftritt.
    Keine Ahnung...

    Wie drauf kam? Verzweiflung.
     

  5. Videos zum Thema
Die Seite wird geladen...
Similar Threads - CSS Verschwommene HDPI
  1. Antworten:
    0
    Aufrufe:
    1.465
  2. Antworten:
    3
    Aufrufe:
    1.397
  3. Antworten:
    1
    Aufrufe:
    1.039
  4. Antworten:
    2
    Aufrufe:
    1.422
  5. Antworten:
    2
    Aufrufe:
    1.395