Loading ...
Sorry, an error occurred while loading the content.

Re: Weird font pixelation/bitmap effect on animation - IE7

Expand Messages
  • Max Case
    Thanks Dav, I guess I didn t delete my post fast enough. 2 mins after I posted, I stumbled on the answer (I got so used to searching the list archive via my
    Message 1 of 6 , Oct 1, 2007
    • 0 Attachment
      Thanks Dav,
      I guess I didn't delete my post fast enough. 2 mins after I posted, I
      stumbled on the answer (I got so used to searching the list archive
      via my gmail, I forgot that I don't have the full history of this list
      in there, which is where the answer was in the end :) )

      max.

      --- In ydn-javascript@yahoogroups.com, dav.glass@... wrote:
      >
      > Max --
      >
      > Try adding a background color to the div's: toggler_1 & toggler_2
      >
      > Dav
      >
      > Dav Glass
      > dav.glass@...
      > blog.davglass.com
      >
    • Max Case
      Does anyone know if there s anyting else that can be done for this problem, other than adding a background-color? The problem is, I have a BG image in the div
      Message 2 of 6 , Oct 24, 2007
      • 0 Attachment
        Does anyone know if there's anyting else that can be done for this
        problem, other than adding a background-color?
        The problem is, I have a BG image in the div the text is sitting in,
        so setting the bgcolor obscures some of this image.
        I tried setting the background-color to transparent, but that doesn't
        work.

        Thanks,
        Max.


        --- In ydn-javascript@yahoogroups.com, dav.glass@... wrote:
        >
        > Max --
        >
        > Try adding a background color to the div's: toggler_1 & toggler_2
        >
        > Dav
        >
        > Dav Glass
        > dav.glass@...
        > blog.davglass.com
      • alexshusta
        Microsoft changed how ClearType fonts are handled in IE7, one of those changes was to remove all font-smoothing on elements that have been positioned or had a
        Message 3 of 6 , Dec 16, 2007
        • 0 Attachment
          Microsoft changed how ClearType fonts are handled in IE7, one of those changes was to remove all font-smoothing on elements that have been positioned or had a filter (e.g. YUI's handling of opacity) applied to them.

          The outcome is that fonts on IE7 look, shall we say, oldschool, when they're within an element that has been positioned or animated.

          Here are a couple links that offer background information, and an example:
          http://blogs.msdn.com/ie/archive/2006/08/31/730887.aspx 

          http://buymeasoda.com/dev/issues/ie_cleartype/ie_cleartype.html 

          I don't have a sure-fire solution to fix the problem on hand, but thought you might be interested to know what's causing the issue.

          ~Alexander



          --- In ydn-javascript@yahoogroups.com, "Max Case" <max.case@...> wrote:
          >
          > Does anyone know if there's anyting else that can be done for this
          > problem, other than adding a background-color?
          > The problem is, I have a BG image in the div the text is sitting in,
          > so setting the bgcolor obscures some of this image.
          > I tried setting the background-color to transparent, but that doesn't
          > work.
          >
          > Thanks,
          > Max.
          >
          >
          > --- In ydn-javascript@yahoogroups.com, dav.glass@ wrote:
          > >
          > > Max --
          > >
          > > Try adding a background color to the div's: toggler_1 & toggler_2
          > >
          > > Dav
          > >
          > > Dav Glass
          > > dav.glass@
          > > blog.davglass.com
          >
        • dav.glass@yahoo.com
          You might want to try and add a background color to the element that you are animating the opacity of.. Dav Dav Glass dav.glass@yahoo.com blog.davglass.com +
          Message 4 of 6 , Dec 16, 2007
          • 0 Attachment
            You might want to try and add a background color to the element that you are animating the opacity of..

            Dav
             
            Dav Glass
            dav.glass@...
            blog.davglass.com
             
             
            + Windows: n. - The most successful computer virus, ever. +
            + A computer without a Microsoft operating system is like a dog
            without bricks tied to its head +
            + A Microsoft Certified Systems Engineer is to computing what a
            McDonalds Certified Food Specialist is to fine cuisine +


            ----- Original Message ----
            From: alexshusta <alexshusta@...>
            To: ydn-javascript@yahoogroups.com
            Sent: Sunday, December 16, 2007 10:35:16 AM
            Subject: [ydn-javascript] Re: Weird font pixelation/bitmap effect on animation - IE7

            Microsoft changed how ClearType fonts are handled in IE7, one of those changes was to remove all font-smoothing on elements that have been positioned or had a filter (e.g. YUI's handling of opacity) applied to them.

            The outcome is that fonts on IE7 look, shall we say, oldschool, when they're within an element that has been positioned or animated.

            Here are a couple links that offer background information, and an example:
            http://blogs.msdn.com/ie/archive/2006/08/31/730887.aspx 

            http://buymeasoda.com/dev/issues/ie_cleartype/ie_cleartype.html 

            I don't have a sure-fire solution to fix the problem on hand, but thought you might be interested to know what's causing the issue.

            ~Alexander



            --- In ydn-javascript@yahoogroups.com, "Max Case" <max.case@...> wrote:
            >
            > Does anyone know if there's anyting else that can be done for this
            > problem, other than adding a background-color?
            > The problem is, I have a BG image in the div the text is sitting in,
            > so setting the bgcolor obscures some of this image.
            > I tried setting the background-color to transparent, but that doesn't
            > work.
            >
            > Thanks,
            > Max.
            >
            >
            > --- In ydn-javascript@yahoogroups.com, dav.glass@ wrote:
            > >
            > > Max --
            > >
            > > Try adding a background color to the div's: toggler_1 & toggler_2
            > >
            > > Dav
            > >
            > > Dav Glass
            > > dav.glass@
            > > blog.davglass.com
            >

          • soloracing2k
            In IE7 this workaround doesn t work for me. But i tried the fix propose here. http://mattberseth.com/blog/2007/12/ie7_cleartype_dximagetransform.html I saw
            Message 5 of 6 , Aug 25, 2008
            • 0 Attachment
              In IE7 this workaround doesn't work for me.
              But i tried the fix propose here.
              http://mattberseth.com/blog/2007/12/ie7_cleartype_dximagetransform.html

              I saw that if I remove the filter after the animation completes, this
              weird effect goes away.

              ...
              function removeFilter(element)
              {
              if (element.style.filter && element.style.removeAttribute)
              {
              element.style.removeAttribute('filter');
              }
              }
              ...

              Wouldn't it we useful to add this to yui code? (I don't know where
              exactly).


              --- In ydn-javascript@yahoogroups.com, dav.glass@... wrote:
              >
              > You might want to try and add a background color to the element that
              you are animating the opacity of..
              >
              > Dav
              >
              > Dav Glass
              > dav.glass@...
              > blog.davglass.com
              >
              > + Windows: n. - The most successful computer virus, ever. +
              > + A computer without a Microsoft operating system is like a dog
              > without bricks tied to its head +
              > + A Microsoft Certified Systems Engineer is to computing what a
              > McDonalds Certified Food Specialist is to fine cuisine +
              >
              > ----- Original Message ----
              > From: alexshusta <alexshusta@...>
              > To: ydn-javascript@yahoogroups.com
              > Sent: Sunday, December 16, 2007 10:35:16 AM
              > Subject: [ydn-javascript] Re: Weird font pixelation/bitmap effect on
              animation - IE7
              >
              >
              >
              >
              >
              >
              >
              >
              > <!--
              >
              > #ygrp-mkp{
              > border:1px solid #d8d8d8;font-family:Arial;margin:14px
              0px;padding:0px 14px;}
              > #ygrp-mkp hr{
              > border:1px solid #d8d8d8;}
              > #ygrp-mkp #hd{
              >
              color:#628c2a;font-size:85%;font-weight:bold;line-height:122%;margin:10px
              0px;}
              > #ygrp-mkp #ads{
              > margin-bottom:10px;}
              > #ygrp-mkp .ad{
              > padding:0 0;}
              > #ygrp-mkp .ad a{
              > color:#0000ff;text-decoration:none;}
              > -->
              >
              >
              >
              >
              > Microsoft changed how ClearType fonts are handled in IE7, one of
              those changes was to remove all font-smoothing on elements that have
              been positioned or had a filter (e.g. YUI's handling of opacity)
              applied to them.
              >
              > The outcome is that fonts on IE7 look, shall we say, oldschool, when
              they're within an element that has been positioned or animated.
              >
              > Here are a couple links that offer background information, and an
              example:
              > http://blogs.msdn.com/ie/archive/2006/08/31/730887.aspx
              >
              > http://buymeasoda.com/dev/issues/ie_cleartype/ie_cleartype.html
              >
              > I don't have a sure-fire solution to fix the problem on hand, but
              thought you might be interested to know what's causing the issue.
              >
              > ~Alexander
              >
              >
              > --- In ydn-javascript@yahoogroups.com, "Max Case" <max.case@> wrote:
              > >
              > > Does anyone know if there's anyting else that can be done for this
              > > problem, other than adding a background-color?
              > > The problem is, I have a BG image in the div the text is sitting in,
              > > so setting the bgcolor obscures some of this image.
              > > I tried setting the background-color to transparent, but that doesn't
              > > work.
              > >
              > > Thanks,
              > > Max.
              > >
              > >
              > > --- In ydn-javascript@yahoogroups.com, dav.glass@ wrote:
              > > >
              > > > Max --
              > > >
              > > > Try adding a background color to the div's: toggler_1 & toggler_2
              > > >
              > > > Dav
              > > >
              > > > Dav Glass
              > > > dav.glass@
              > > > blog.davglass.com
              > >
              >
            Your message has been successfully submitted and would be delivered to recipients shortly.