1

We design a website using zoomooz plugin that use transforms like translate scale skew etc. everything work fine in some browsers like mozilla, i mean images have their transform and showed very well,but in chrome images after transform become blurry.

there is some conversation about this problem. but what about images? how can i show them without blurry effect . this is very important for us to show images with good quality in website.

Example:

In chrome Version 49.0.2623.112 m

In mozilla fierfox 46.0

Community
  • 1
  • 1
A.F.N
  • 199
  • 2
  • 15
  • Have you tried `-webkit-backface-visibility: hidden;` – jbutler483 Apr 26 '16 at 19:41
  • 1
    As [@Doupixel](http://stackoverflow.com/a/8038694/4796321) mentioned in his answer, webkit does not treat transformed elements as vectors, so they will loose that quality. If you mean that images become blurry, then they probably have a shitty quality to begin with, so you can't scale them up or whatever. Please improve your question so I can go into the **exact** probem. – Sainan Apr 26 '16 at 19:44

1 Answers1

1

Try this 

img {
    -webkit-backface-visibility: hidden; 
    backface-visibility: hidden;
    -ms-transform: translateZ(0); 
    -webkit-transform: translateZ(0); 
    transform: translateZ(0);
}
dimitar
  • 1,019
  • 13
  • 19