4

Blob images in Firefox are rendered in a low quality. The quality raises though if I place a cursor upon them and decreases again If I move the cursor away.

Here is source of the image:

<img height="164" width="246" src="blob:0e2e0a22-4dd8-4c2d-a8e4-e4c1e65f03b4"></img>

Screenshot with cursor outside of the image:

enter image description here

Screenshot with cursor inside of the image:

enter image description here

You can see that the second picture is much better. How can I get good images by default? This doesn't happen in Chrome where images are always rendered nicely.

EDIT: If there is no javascript action on hover (the buttons appearing), the quality is not being improved on hover.

NOTE: I have repainted the cursor because it has not been screenshoted. My Firefox version is 24.0 if that is important.

clime
  • 8,695
  • 10
  • 61
  • 82
  • Is the image 246x164? I get the impression it is actually a little larger. http://stackoverflow.com/questions/9945363/image-scaling-causes-poor-quality-in-firefox-internet-explorer-but-not-chrome?rq=1 solution in this question states that relying on browser to rescale image is not recommended, but they may supply some more information - I didn't read the whole thing. – DoubleDouble Dec 30 '13 at 20:25
  • 1
    The image is of the given size. I have zoomed it in so that the difference in quality is more visible. The images are generated in frontend (using blueimp-load-image plugin) so there is no backend involved. – clime Dec 30 '13 at 20:38

1 Answers1

0

What happens when you remove your width and height attributes? Or are they rendered?

R-b-n
  • 464
  • 5
  • 19