Spider web link effect
Note: Modified slightly by DD to disable horizontal scrollbar. Read important note below.
Description: Creativity and ingenuity come together here to form one of the most unique onMouseover effects for your links. With the help of VML, a "spider web" follows the mouse, and expands when moved over designated links. Awesome effect that degrades well with non IE5+ browsers.
Demo: "Just move your mouse over this textlink to see the highlight effect. The script even allows you to use different highlight colors on the very same webpage as this textlink and this textlink are demonstrating."
Step 1: Insert the following stylesheet into the <head> section of your page:
Step 2: Insert the below code into the BODY section of your page, immediately following the <BODY> tag itself:
With the above in place, to give a particular text link on your page the spider effect, add to it the below onMouseover/onMouseout code, as shown here:
<a href="http://mydomain.com" onMouseOver="msover('#FFEEEE')" onMouseOut="msout()"> Test link</a>
Enjoy!
Important note
This script explicitly disables the horizontal scrollbar of the browser, which the spider effect adds, from appearing. If your page contains content which may require the H scrollbar to view (ie: a table with width set to 1500px, text wrapped inside a <nobr> tag etc, you will want to take out the code:
.disableHscroll{ width:100%;overflow-x:hidden;overflow-y:scroll; }
from the style sheet of Step 1. This throws back in the horizontal scrollbar.