Safari transform: scale(), bad image quality when added by JS

user_16332047 0
Viewed 196

I have a JavaScript function, which add a 'transform: translate(x, y) scale(z)' to an image. But with this way, safari doesn't show the image sharp, instead it seems to be decreased.

In Firefox and Chrome it's working fine. But when I add the 'transform: translate(x, y) scale(z)' manually in the dev-tools, the image is shown as I expect. Sharpe and nice.

What could be the reason for that?

Image with low sharpness

Image with height sharpness

Hope you can help me out.

safari image html javascript
1 Answers

I solved this issue by adding the transform property direct to the image. Before, it was added to the wrapper element of the image.

It's okay for now but a stupid behavior of safari when I imagine a situation in which I am forced to use transform scale on a div with an image in it.

user_163320470
Related