web-dev-qa-db-fra.com

Utilisation de la transformation: les résultats d'échelle dans les images floues

Dans notre vue catalogue (boutique en ligne), nous utilisons javascript pour obtenir différentes vues des produits et réduire les images avec CSS. 3 d'affilée/4 ou 5 /

enter image description here

La vue par défaut est 4:

-webkit-transform: scale(0.83);
-moz-transform: scale(0.83);
-ms-transform: scale(0.83);
-o-transform: scale(0.83);
transform: scale(0.83);

Tout fonctionne mais les images sont très floues en safari. Existe-t-il un moyen d'améliorer le rendu pour Safari? Image plus grande: http://i.stack.imgur.com/NaFeB.jpg

enter image description here

css3safaritransformscale
22
grindking

cela fonctionne si vous réinitialisez le filtre de flou en safari:

-webkit-filter: blur(0px);

exemple pour tous les navigateurs:

filter: none; 
-webkit-filter: blur(0px); 
-moz-filter: blur(0px); 
-ms-filter: blur(0px);
filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='0');

j'espère que cela aide

43
spinsch