Ich habe dieses transparente rasterartige Hintergrund-Overlay: Link zum Bild - versuche, deinen Browser zu verkleinern um den Effekt zu sehen
Beim Vergrößern oder Verkleinern (besonders bei mobilen Geräten passiert das sehr oft) sieht das Bild verschmiert und hässlich aus. Gibt es eine Möglichkeit, dieses Hintergrundbild immer 10 x 10 Pixel auf dem Bildschirm zu haben, egal wie die Seite gezoomt wird, so dass es immer scharf aussieht?
Bei einigen Suchen habe ich festgestellt, dass dies eine schwierige Aufgabe ist. Falls es nicht möglich ist: Gibt es eine Möglichkeit, die Zoom-Filter so zu verändern, dass das Bild beim Heraus- oder Herauszoomen besser aussieht?
Auf Hi-Res-Displays, wie bei Mobilgeräten, haben Sie aufgrund der hohen Auflösung auf einem kleinen Bildschirm immer einen verschwommenen Effekt aufgrund der hohen Pixeldichte.
Es gibt eine Problemumgehung, um dies zu beheben:
Erstellen Sie ein doppeltes Hintergrundbild: Ihr Bild ist 10px 10px, erstellen Sie stattdessen ein 20px 20px.
Übernehmen Sie das Hintergrundbild mit der gewünschten Größe: background-size: 10px 10px;
Mit diesem Trick erscheint das Bild beim Vergrößern oder Betrachten des Bildes auf dem Hi-Res-Display nicht mehr verschwommen.
Wie in den Kommentaren gefordert, ist hier der Code, um die Hintergrundgröße an den Zoom anzupassen:
JAVASCRIPT:
%Vor%HTML:
%Vor%Tags und Links javascript html jquery css image
