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

Hovering on sortable datatable column causes text resize

Expand Messages
  • Todd Wells
    I m using YUI 2.6.0 with the sam skin and have sortable columns. When you hover over the text on a sortable column, the text shrinks slightly, which can create
    Message 1 of 5 , Apr 1, 2009
    • 0 Attachment
      I'm using YUI 2.6.0 with the sam skin and have sortable columns. When you hover over the text on a sortable column, the text shrinks slightly, which can create a flickering effect if you place the mouse right on the edge of the text (very noticable with Firefox). I can't figure out what CSS to change in order to stop the text resizing in this way.

      Basically because the font size is different for the hover-over, the browser can't make up it's mind whether you're hovering or not. The font size gets smaller when you hover, then as you're mousing out of the smaller font, the font gets larger, so then you're no longer moused out, you're hovering, so the font gets smaller. Because the font just got smaller, you're no longer hovering, so the font gets larger and you're hovering again so the font changes, ad nauseum.
    • cjavajim
      ... It would be helpful if you posted a link to your code, or to a representative YUI example, so we have something specific to take a look at.
      Message 2 of 5 , Apr 1, 2009
      • 0 Attachment
        --- In ydn-javascript@yahoogroups.com, Todd Wells <ttopwells@...> wrote:
        >
        > I'm using YUI 2.6.0 with the sam skin and have sortable columns. When you
        > hover over the text on a sortable column, the text shrinks slightly, which
        > can create a flickering effect if you place the mouse right on the edge of
        > the text (very noticable with Firefox). I can't figure out what CSS to
        > change in order to stop the text resizing in this way.
        >
        > Basically because the font size is different for the hover-over, the browser
        > can't make up it's mind whether you're hovering or not. The font size gets
        > smaller when you hover, then as you're mousing out of the smaller font, the
        > font gets larger, so then you're no longer moused out, you're hovering, so
        > the font gets smaller. Because the font just got smaller, you're no longer
        > hovering, so the font gets larger and you're hovering again so the font
        > changes, *ad nauseum*.
        >

        It would be helpful if you posted a link to your code, or to a representative YUI example, so we have something specific to take a look at.
      • cjavajim
        ... Have you tried using Firefox/Firebug or Microsoft s IE Developer Toolbar to inspect/edit the CSS and etc. yourself? (That s all I would do if I had a link
        Message 3 of 5 , Apr 1, 2009
        • 0 Attachment
          --- In ydn-javascript@yahoogroups.com, Todd Wells <ttopwells@...> wrote:
          >
          > I'm using YUI 2.6.0 with the sam skin and have sortable columns. When you
          > hover over the text on a sortable column, the text shrinks slightly, which
          > can create a flickering effect if you place the mouse right on the edge of
          > the text (very noticable with Firefox). I can't figure out what CSS to
          > change in order to stop the text resizing in this way.
          >
          > Basically because the font size is different for the hover-over, the browser
          > can't make up it's mind whether you're hovering or not. The font size gets
          > smaller when you hover, then as you're mousing out of the smaller font, the
          > font gets larger, so then you're no longer moused out, you're hovering, so
          > the font gets smaller. Because the font just got smaller, you're no longer
          > hovering, so the font gets larger and you're hovering again so the font
          > changes, *ad nauseum*.
          >

          Have you tried using Firefox/Firebug or Microsoft's IE Developer Toolbar to inspect/edit the CSS and etc. yourself? (That's all I would do if I had a link to your code.)
        • Satyam
          I still have YUI 2.6 downloaded in my computer. I tried the client sort column with Firefox, which is what I use by default, and couldn t reproduce the effect
          Message 4 of 5 , Apr 2, 2009
          • 0 Attachment
            I still have YUI 2.6 downloaded in my computer. I tried the client sort
            column with Firefox, which is what I use by default, and couldn't
            reproduce the effect you mention. Can you point us somewhere when we
            see it happen? Does it still happen in later versions, if not, do a
            diff over the CSS files and look for differences in some style with a
            :hover selector.

            Satyam


            Todd Wells escribió:
            > I'm using YUI 2.6.0 with the sam skin and have sortable columns. When
            > you hover over the text on a sortable column, the text shrinks
            > slightly, which can create a flickering effect if you place the mouse
            > right on the edge of the text (very noticable with Firefox). I can't
            > figure out what CSS to change in order to stop the text resizing in
            > this way.
            >
            > Basically because the font size is different for the hover-over, the
            > browser can't make up it's mind whether you're hovering or not. The
            > font size gets smaller when you hover, then as you're mousing out of
            > the smaller font, the font gets larger, so then you're no longer
            > moused out, you're hovering, so the font gets smaller. Because the
            > font just got smaller, you're no longer hovering, so the font gets
            > larger and you're hovering again so the font changes, /ad nauseum/.
            >
            >
            > ------------------------------------------------------------------------
            >
            >
            > No virus found in this incoming message.
            > Checked by AVG - www.avg.com
            > Version: 8.5.285 / Virus Database: 270.11.35/2034 - Release Date: 04/01/09 06:06:00
            >
            >
          • Todd Wells
            Unfortunately the code is in an app that isn t public yet, so I ll have to see if I can contrive an example. I ll email again if I come up with something.
            Message 5 of 5 , Apr 2, 2009
            • 0 Attachment
              Unfortunately the code is in an app that isn't public yet, so I'll have to see if I can contrive an example. I'll email again if I come up with something. Thanks for your willingness to help.


              On Thu, Apr 2, 2009 at 1:12 AM, Satyam <satyam@...> wrote:
              I still have YUI 2.6 downloaded in my computer.  I tried the client sort
              column with Firefox, which is what I use by default, and couldn't
              reproduce the effect you mention.  Can you point us somewhere when we
              see it happen?  Does it still happen in later versions, if not, do a
              diff over the CSS files and look for differences in some style with a
              :hover selector.

              Satyam


              Todd Wells escribió:
              > I'm using YUI 2.6.0 with the sam skin and have sortable columns. When
              > you hover over the text on a sortable column, the text shrinks
              > slightly, which can create a flickering effect if you place the mouse
              > right on the edge of the text (very noticable with Firefox). I can't
              > figure out what CSS to change in order to stop the text resizing in
              > this way.
              >
              > Basically because the font size is different for the hover-over, the
              > browser can't make up it's mind whether you're hovering or not. The
              > font size gets smaller when you hover, then as you're mousing out of
              > the smaller font, the font gets larger, so then you're no longer
              > moused out, you're hovering, so the font gets smaller. Because the
              > font just got smaller, you're no longer hovering, so the font gets
              > larger and you're hovering again so the font changes, /ad nauseum/.


              ------------------------------------

              Yahoo! Groups Links

              <*> To visit your group on the web, go to:
                 http://groups.yahoo.com/group/ydn-javascript/

              <*> Your email settings:
                 Individual Email | Traditional

              <*> To change settings online go to:
                 http://groups.yahoo.com/group/ydn-javascript/join
                 (Yahoo! ID required)

              <*> To change settings via email:
                 mailto:ydn-javascript-digest@yahoogroups.com
                 mailto:ydn-javascript-fullfeatured@yahoogroups.com

              <*> To unsubscribe from this group, send an email to:
                 ydn-javascript-unsubscribe@yahoogroups.com

              <*> Your use of Yahoo! Groups is subject to:
                 http://docs.yahoo.com/info/terms/


            Your message has been successfully submitted and would be delivered to recipients shortly.