Advanced Search Usage Terms Submit Contact
Dynamic Drive CSS Library
 
CSS Library
Submit an original CSS code
CSS Layouts
Web Graphics
Online Tools:

Advertise Here

CSS Library: Links & Buttons: Here

Animated link underlines

Author: Kieren Harding

This fun CSS code adds an animated underline to links on the page when the mouse rolls over them to grab visitors' attention!

Demo:

"I'm happy to announce the first Dynamic Drive CSS code contest, hopefully the first of many to come! Show off your CSS talents by submitting an original, CSS example to possibly be featured here. The top 3 submissions will each be awarded with a prize"

The single image used:

The CSS:

Code Info

Rate this code:

Date Posted: 09/17/2006

Revision History: None

Usage Terms: Click here

Your Comments (40)

Got a question or need help customizing this CSS code? Post it in the CSS Forums. If you have a comment or suggestion instead, post it in the comments section below.

Comment Pages 2 of 4 pages  <  1 2 3 4 >

This does not work in like most things this does not work in Internet Explorer.
Posted by Kevin on 11/03, 08:50 AM
Reminds me of the "Marching Ants" in MS Word...

Works fine for me in IE 6.
Posted by Tom on 11/03, 03:10 PM
This is so cool. I tried this beauty on my CSS journl on Deviantart. Thank you Kieren.
Posted by kjherstin on 11/11, 07:42 PM
People have criticised the graphic used in the example above but this was only used for demonstrational purposes. You can have a much more subtle effect by simply using a different graphic, for example checkout the effect kjherstin (above) achived by using a different graphic - http://kjherstin.deviantart.com/journal/

Nice one kjherstin!
Posted by Kieren on 11/12, 07:13 AM
it is easy but very effective. i like it very much. i have never thought as this.
Posted by aashique on 11/20, 07:17 AM
Michael is upset he didnt think of it .. I think it's terrific and as rguerra suggests, it won't overload the page
Posted by onefeather on 12/15, 08:44 PM
Never thought of that! Nice job, simple plus effective! YOu could've used a different AGIF though...
Posted by Hans99 on 01/17, 10:43 PM
Works very well, thank you very much!
Posted by Bagi Zoltán on 03/10, 03:57 PM
This one is creative. I think I can adapt it for another idea I have. Thanks for sharing.
Posted by Carrousel Yacht on 03/28, 12:42 PM
if you ever hope to retain visitors, avoid using this technique at all costs.
Posted by Jason on 05/01, 12:57 PM

Comment Pages 2 of 4 pages  <  1 2 3 4 >

Commenting is not available in this weblog entry.
Copyright 2006-2011 Dynamic Drive Read our Usage Terms before using any of the CSS codes.