#mouse-over

A VERY COOL example of outside the box thinking from Daniel Wood of Digital Fusion:

The slide control is an exciting new  layout tool introduced in FileMaker 13. Because of it’s primary function of sliding via a swipe, it is built with FileMaker Go in mind. However it is quickly finding it’s place in FileMaker Pro with a number of cool uses for it being introduced into the community.

The slide…

The following is a follow-on to Jason Edelman's fine tutorial. (Also see listomatic.)

Here's what I want:

#nav { width: 300px; font-size: 12px; line-height: 20px; } #nav UL { list-style-type: none; margin: 0; padding: 0; } #nav LI { width: 100px; background: #DDD; background-image: none; list-style-type: none; margin: 0; padding: 0; } #nav A { width: 100px; display: block; } #nav A:hover { color: #CC3; background: #CFC; background-image: url(img/arrows.gif); background-repeat: no-repeat; background-position: right; }

First item

Second item

This is a pretty basic application of ID selectors and that nutty img() function in CSS. Even though you could view the source of the is page to see how it's done, I'll just escape it here for the lazy:

<style type="text/css"> #nav { width: 300px; font-size: 12px; line-height: 20px; } #nav UL { list-style-type: none; margin: 0; padding: 0; } #nav LI { width: 100px; background: #DDD; background-image: none; list-style-type: none; margin: 0; padding: 0; } #nav A { width: 100px; display: block; } #nav A:hover { color: #CC3; background: #CFC; background-image: url(img/arrows.gif); background-repeat: no-repeat; background-position: right; } </style> <ul id="nav"> <li><a href="first.html">First item</a></li> <li><a href="second.html">Second item</a></li> </ul>

Notice that the width for the #nav A element and the #nav LI element should agree. I wish there were a more generic way of setting this size (I suppose some fancy javascript could do it), but since I intend to use this for navigational stuff, this is just fine for me.

I finally got around to messing around with it and it is so fucking cool.  You don't even have to hover over name plates to heal someone!  Just highlight a character around you and bam, healed. 

In case you guys missed how to use it, it is:

#show Healing Spray

cast @mouseover Healing Spray

Replace "Healing Spray" with the name of any of your healing spells and VOILA! :)