Link Transitions

Introduction
A link transition is kind of like a page transition, only it's applied to a link. It only works in recent versions of Internet Explorer, although I'm not sure which. Most likely 5.0+.

Hover over this for a link transition sample.

How To Do It
First Download link.htc, and upload it to your server. You don't need to open it, just upload.

On the pages you want to apply a link transition to, type this somewhere after the </title>, but before the </head> tag.

<style type="text/css">
<!--
a { behavior:url(link.htc); filter: progid:dximagetransform.microsoft.barn(duration=0.7); height: 0px; color: #009933; text-decoration: none}
a:hover { color: #FFFFFF; text-decoration: none; background-color: #009933}
-->
</style>

This will format all your links exactly how I have my sample transition above. You of course, will want to change it to your own needs.

1. Change link.htc to the path that leads to the link.htc file. If your .htc file, and the HTML pages containing the link effects are in the same folder, then no changes are needed.
2. Change barn to the effect you want, a list of your choices are below.
3. 0.7 determines the speed of the transition. A higher number = slower transition.
4. color: #009933; text-decoration: none: You can apply whatever other CSS you want to the links. Right now they are set to be green with no underlines.
5. color: #FFFFFF; text-decoration: none; background-color: #009933: This is what the link looks like when the mouse is hovering over the link, and the transition is complete.

Transition Choices
A Sample Of Each Transition

barn
blinds
checkerboard
fade
gradientwipe
inset
iris
pixelate
radialwipe
randombars
randomdissolve
slide
spiral
stretch
strips
wheel
zigzag

Main?