2012-04-11 8 views
5

J'optimise mon site pour ces moniteurs de résolution supérieure (en particulier le nouvel iPad). J'ai mis en forme le site comme je le voulais, et j'allais juste augmenter la résolution de chaque image tout en la contraignant aux DIVs que j'ai actuellement. Par exemple, j'ai une image avec une résolution de 483x246 et je l'ai un DIV avec une taille de 188x96.Image haute résolution Rendu du navigateur IE

Les images sont superbes sur Chrome, Firefox et, plus important encore, sur le nouvel iPad. Même zoomé c'est beau et net (par opposition à mon ancienne image 188x96 qui avait l'air floue et pixélisée lorsque zoomé)

Le problème vient quand j'ouvre la page dans IE. Il affiche l'image à la taille correcte mais elle est dentelée. Voir le lien vers la comparaison ci-dessous. Je sais que c'est un problème avec la façon dont IE redimensionne et rend les images à la volée.

Ma question serait, est-il un moyen de rendre IE afficher l'image bien? Si non, y a-t-il un moyen que je puisse mettre dans le code pour que, s'il détecte IE, il affiche mon ancienne image basse résolution? J'ai regardé partout, mais je n'ai rien trouvé qui se rapporte à mon problème spécifique. Je sais que c'est un petit exemple, mais mes images plus grandes font la même chose et sont plus visibles. J'espère que vous pouvez tous aider. Merci. :)

Comparaison: enter image description here

Répondre

3

Avez-vous essayé de mettre dans votre CSS?

img {-ms-mode interpolation: bicubique; }

Il y a aussi ce https://github.com/adamdbradley/foresight.js qui semble très intéressant

Assurez-vous que IE9 est pas en mode de compatibilité ou en mode IE7/8 ... IE9 Mode

+0

Merci! Cela a fonctionné mais pour les versions antérieures de IE. IE 9 montre toujours des images dentelées. :(Eh bien, je vais devoir vérifier ce script, ça a vraiment l'air intéressant, merci encore – djcloud23

+0

Pourriez-vous m'envoyer un lien de l'exemple? Je suis sûr que nous pouvons résoudre ce problème ... avez-vous aussi vérifié que votre IE9 n'est pas en mode IE7 ou IE8? appuyez sur F12 puis cliquez où il est dit Mode de navigateur: IE ... – hcharge

0

La raison pour laquelle cette happends si parce que le BitmapData est effectivement rendu complètement différent dans le navigateur IE, la chose IE n'est-il « coupe » pixels loin sur un rapport de jeu afin que tous les 5 pixels, il arrache un pixel et donne l'impression qu'il manque certaines propriétés de gradient.

pas que vous pouvez faire à ce sujet, sauf pour maintenir l'ensemble du rapport d'aspect, mais je suppose que vous auriez su que par vous-même déjà

Questions connexes