IE image interpolation

  • Unknown's avatar

    Hi. Loving wordpress but having issues with IE image quality with scaled images: they are coming out very blocky.

    I understand that the fix is this:

    img
    {
    -ms-interpolation-mode: bicubic;
    }

    My account doesn’t enable CSS editing however. Do you know if there is a simple way for me to ensure IE interpolates images smoothly without having to edit the CSS? Or if not, can someone tell me the simplest way to make this change? The theme I’m using is the premium theme React by the Theme Foundry.

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar

    This external link shows the issue, in case it’s not clear:

    http://www.joelonsoftware.com/items/2008/12/22.html

  • Unknown's avatar

    You can do that as inline CSS in the image HTML code, but I’ve never used it so I have no idea if the code is allowed or not, and in general I’ve not seen any cases where it is required here at wordpress.com. On the main image on your site at upper right, make the image code look like the below in the HTML tab in the editor.

    <img style="-ms-interpolation-mode: bicubic;" width="600" height="450" title="leliegracht" alt="leliegracht" class="attachment-react-thumb wp-post-image" src="http://skdadvocaten.files.wordpress.com/2011/08/leliegracht1.jpg?w=600&h=450&crop=1">

    Past that since this is a premium theme that the volunteers here have no access to and thus cannot play with it, we have zero knowledge of it so you will have to ask in the premium theme support forum. There is a link in your dashboard near the top at appearance > themes.

  • Unknown's avatar

    Ok. I’ll try that out, and also talk to the people that make the theme, as they should probably have this enabled by default. It uses a very liquid layout so I imagine the issue is cropping up with many of their users.

    I had no idea it was going on until I accidentally checked the site on a friends PC running IE. A rare occurrence :)

    Many thanks!

  • Unknown's avatar

    The other thing that can have a big issue on this is if the PC happens to have the monitor resolution set to something other than the native resolution. For example if the monitor is a widescreen and they have chosen a 4:3 resolution.

    That said, I’ve never seen the ms interpolation mode stuff in an theme CSS either here or on self-hosted sites, and I’ve done a ton of customization for people. Unless there is something really peculiar that they have done in this particular theme, it may turn out to be something else related to settings on the PC and/or in IE.

  • Unknown's avatar

    The image interpolation is working fine for the rest of the site, it’s only the ‘custom logo image’, which is a theme option and can’t afaik be manually edited in HTML. I’ve left a message in the Premium Themes Support Forum, will see what happens.

    Thanks agai

  • Unknown's avatar

    A couple other things: This only affects images that are “stretched” (say from 200×200 to 400×400). It does not apply to images that are downsized such as happens in React which is designed to work with all resolution screens clear down to smart phones (reactive design). It also only works with IE7 and IE8. It is now obsolete as of IE9.

    From The MSDN website:

    The msInterpolationMode property is obsolete as of Windows Internet Explorer 9. Do not use. The msInterpolationMode property was introduced in Internet Explorer 7.

    The msInterpolationMode property applies to stretched images only. For example, if the natural width of the image is 200×200 but the page designer specifies that the height and width should be 400×400, then the image will be stretched to the new dimensions using the nearest-neighbor algorithm, unless otherwise specified.

    If the zoom level of the page is 100%, the default interpolation is nearest-neighbor, otherwise bicubic mode is used.

  • Unknown's avatar

    Hmmm, Odd.

    The image is large and being scaled downwards. I made it large since on iPad it shows larger, and you can of course zoom in a bit on iPad (and smartphones in general).

    It is a brand new Windows 7 PC, so I assume it’s running IE 9. I’ll have to go back and check.

    I downloaded Chrome on that PC and it looked great, so it’s an IE issue.

    Mysterious.

    Thank you for looking that up.

  • Unknown's avatar
  • Unknown's avatar

    Here’s how it looks on my old windows XP machine I just dusted off and switched on:

    Chrome above, IE 7 below:

    http://dl.dropbox.com/u/10866745/skd/skdlogoissue.png

    Its definitely not a PC setting issue, since this is a different PC.

  • Unknown's avatar

    That has always been an issue with IE and is why, even when I was having to use Windows, I would always use Firefox. IE renders virtually everything poorly in my opinion and never approaches the quality of any other browser. IE9 is renders better, but even it is still light years behind Safari, Opera, Firefox and Chrome.

  • Unknown's avatar

    I completely agree!

    Unfortunately as lawyers: most lawyers and likely clients are very not-web aware and tend to use old versions of windows and IE.

  • The topic ‘IE image interpolation’ is closed to new replies.