IE8 blurs zoomed in picture

Discussion in 'HTML' started by Skybuck Flying, Dec 12, 2010.

  1. http://www.skybuck.org/BoxifyMe/

    At the bottom of the page the images are zoomed in... but IE8 pretty much
    screws up badly and blurs the whole fricking thing ?!

    Not good ?!

    Is there a way to get rid of the blur ?!? (Without having to make new zoomed
    in pictures... ?)

    Bye,
    Skybuck.
    Skybuck Flying, Dec 12, 2010
    #1
    1. Advertising

  2. Sun, 12 Dec 2010 09:57:19 +0100, /Skybuck Flying/:

    > http://www.skybuck.org/BoxifyMe/
    >
    > At the bottom of the page the images are zoomed in... but IE8 pretty much
    > screws up badly and blurs the whole fricking thing ?!
    >
    > Not good ?!
    >
    > Is there a way to get rid of the blur ?!? (Without having to make new zoomed
    > in pictures... ?)


    Mozilla implements an 'image-rendering' [1] CSS property which
    appears to be originally a SVG property [2] and not defined in any
    current CSS standard. The Mozilla docs also point out an IE
    specific property '-ms-interpolation-mode' [3] which default value
    seems changed between IE7 and IE8.

    So I guess you could to add to your style sheet:

    #AutoNumber1 img {
    image-rendering: optimizeSpeed;
    image-rendering: -moz-crisp-edges;
    -ms-interpolation-mode: nearest-neighbor;
    }

    [1] https://developer.mozilla.org/en/CSS/image-rendering
    [2] http://www.w3.org/TR/SVG/painting.html#ImageRenderingProperty
    [3] http://msdn.microsoft.com/en-us/library/ff521095(VS.85).aspx

    --
    Stanimir
    Stanimir Stamenkov, Dec 12, 2010
    #2
    1. Advertising

  3. "Stanimir Stamenkov" <> wrote in message
    news:ie2c8c$ivq$-september.org...
    > Sun, 12 Dec 2010 09:57:19 +0100, /Skybuck Flying/:
    >
    >> http://www.skybuck.org/BoxifyMe/
    >>
    >> At the bottom of the page the images are zoomed in... but IE8 pretty much
    >> screws up badly and blurs the whole fricking thing ?!
    >>
    >> Not good ?!
    >>
    >> Is there a way to get rid of the blur ?!? (Without having to make new
    >> zoomed
    >> in pictures... ?)

    >
    > Mozilla implements an 'image-rendering' [1] CSS property which
    > appears to be originally a SVG property [2] and not defined in any
    > current CSS standard. The Mozilla docs also point out an IE
    > specific property '-ms-interpolation-mode' [3] which default value
    > seems changed between IE7 and IE8.
    >
    > So I guess you could to add to your style sheet:
    >
    > #AutoNumber1 img {
    > image-rendering: optimizeSpeed;
    > image-rendering: -moz-crisp-edges;
    > -ms-interpolation-mode: nearest-neighbor;
    > }
    >
    > [1] https://developer.mozilla.org/en/CSS/image-rendering
    > [2] http://www.w3.org/TR/SVG/painting.html#ImageRenderingProperty
    > [3] http://msdn.microsoft.com/en-us/library/ff521095(VS.85).aspx
    >
    > --
    > Stanimir


    Much thanks !

    It looks much better now ! ;) :)

    Bye,
    Skybuck =D
    Skybuck Flying, Dec 12, 2010
    #3
  4. "Stanimir Stamenkov" <> wrote in message
    news:ie2c8c$ivq$-september.org...
    > Sun, 12 Dec 2010 09:57:19 +0100, /Skybuck Flying/:
    >
    >> http://www.skybuck.org/BoxifyMe/
    >>
    >> At the bottom of the page the images are zoomed in... but IE8 pretty much
    >> screws up badly and blurs the whole fricking thing ?!
    >>
    >> Not good ?!
    >>
    >> Is there a way to get rid of the blur ?!? (Without having to make new
    >> zoomed
    >> in pictures... ?)

    >
    > Mozilla implements an 'image-rendering' [1] CSS property which
    > appears to be originally a SVG property [2] and not defined in any
    > current CSS standard. The Mozilla docs also point out an IE
    > specific property '-ms-interpolation-mode' [3] which default value
    > seems changed between IE7 and IE8.
    >
    > So I guess you could to add to your style sheet:
    >
    > #AutoNumber1 img {
    > image-rendering: optimizeSpeed;
    > image-rendering: -moz-crisp-edges;
    > -ms-interpolation-mode: nearest-neighbor;
    > }
    >
    > [1] https://developer.mozilla.org/en/CSS/image-rendering
    > [2] http://www.w3.org/TR/SVG/painting.html#ImageRenderingProperty
    > [3] http://msdn.microsoft.com/en-us/library/ff521095(VS.85).aspx
    >
    > --
    > Stanimir


    Yeah... I forgot to mention this link which explains how to embed it:

    http://msdn.microsoft.com/en-us/library/ms530822(v=vs.85).aspx

    I shall copy the little code section and paste it here for future reference
    just in case the webpage goes down ;) :) Might come in handy some day when
    searching with gooooooogle ;) :)

    <html>
    <head>
    <style>
    img.highqual { -ms-interpolation-mode:bicubic }
    img.nearestn { -ms-interpolation-mode:nearest-neighbor }
    </style>
    </head>
    <body>
    <img src="sphere.jpg" width="175" height="350" class="nearestn">
    <img src="sphere.jpg" width="175" height="350">
    <img src="sphere.jpg" width="175" height="350" class="highqual">
    <p>Change the zoom level of the page to see the difference.</p>
    </body>
    </html>

    (class can be changed in front page editor too... nice ! ;) :))

    I also learned something today... IE8 has a little zoom things in the down
    right corner... I probably already noticed that before but didn't know how
    handy it could be ;) :) so I probably forgot about it... but now I will
    remember I think ! ;) :)

    Bye,
    Skybuck :)
    Skybuck Flying, Dec 12, 2010
    #4
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. shsha
    Replies:
    0
    Views:
    256
    shsha
    Mar 6, 2008
  2. Qu0ll
    Replies:
    5
    Views:
    539
  3. Adrienne Boswell

    Re: IE8 picture list display problem

    Adrienne Boswell, Jun 30, 2009, in forum: HTML
    Replies:
    1
    Views:
    671
    GTalbot
    Jul 13, 2009
  4. Replies:
    8
    Views:
    1,223
    Mick White
    Apr 19, 2005
  5. cecile

    ie8!=ie8

    cecile, May 24, 2010, in forum: Javascript
    Replies:
    2
    Views:
    178
    David Mark
    May 24, 2010
Loading...

Share This Page