treehouse : what would you like to learn today?
Web Design Web Development iOS Development

Animate Text-decoration?

  • I don't see anything in the jQuery API page about this, and I know there are other ways of accomplishing this. But is there a way to animate a change in text-decoration, using the animate method in jQuery? textDecoration doesn't seem to work, and I couldn't find anything else that might be the property name.

    Thanks for any help you can offer!
  • You actually don't need javascript at all :)

    Just use this.

    #mydiv {
    text-decoration: none;
    }

    #mydiv:hover {
    text-decoration: underline;
    }

    It doesn't have to be 'underline', that's just an example. ;)
  • Yes, I'm aware of the CSS property, sorry... I was looking for a way to animate it in jQuery, and have it fade slowly, rather than flash on or off.

    Is there any way in jQuery to Accomplish this?
  • You have a couple of options.

    1. You can use a border, and animate it's width or it's opacity.

    2. I'm not positive this will work, but you could try a css3 animation. It would only work in FF/Safari/Chrome, though.

    I think your best bet would be the border animation.