WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Make Links "Dance" When Hovered (4 posts)

  1. FreelanceHacker
    Member
    Posted 1 year ago #

    I visited a site that had a great feature I want to ... um... borrow.

    When you hover over one of their links, it moves slightly to let you know you have highlighted that particular link.

    Anyone know how I might make that happen myself?

    Thanks!!!!

    FYI: To credit the source I found the trick at WooThemes in their footer widgets... Scroll to the bottom of their site to see what I'm talking about.

  2. alchymyth
    Forum Moderator
    Posted 1 year ago #

    format the a:hover with a different left margin or padding as the link.

    http://www.w3schools.com/css/css_link.asp

  3. WooThemes does it with this:

    #footer #sitemap ul li a:hover {
    text-decoration: none;
    position: relative;
    left: 2px;
    -webkit-transition: all ease-in-out .2s;
    -moz-transition: all ease-in-out .2s;
    -ms-transition: all ease-in-out .2s;
    -o-transition: all ease-in-out .2s;
    transition: all ease-in-out .2s;
    }

    The position attribute sets the final position, and the transition stuff provides the animation effect.

  4. FreelanceHacker
    Member
    Posted 1 year ago #

    You guys are awesome!

    Thanks to both of you!

    M

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.