UI improvement - realtime preview of the offsets

I had a look at what you've done here, and it looks pretty sexy.
Here is a UI addition that displays the preview image and the crop marks to assist in making sense of the 'top, bottom, left, right' values you use.
I actually think there is some tweaking to be done there, but this addition helps me make sure it's doing what I want.

This patch ONLY applies to the scale9actions_overlay form. I can't see why you need a scale-and-overlay and a resize-and-overlay as well, when it seems you can just provide a scale9overlay as an action in the imagecache preset and run it after the normal 'scale' or 'resize' actions.

Anyway, here's a pic:

The UI preview on the page happens in realtime using jquery, css offsets, and a css sprite!
There are some bumps to be worked out (not reviewed in IE6 yet, and I'm not sure what happens if the preview image loads slow on a remote connection) but I like the result so far.

I have no idea what those other values in the form (exact,relative size) are expected to mean, so they are not supported. I imagine they could be expressed using fancier strings in the basic top,bottom fields ( if bottom= -50, that would mean 50 from the bottom, or top could be 25% ) .

Anyway, the UI needs to be a little friendlier. I understand most of it, because I've already built the same thing once before - using pure css - but I know it can be hard to communicate the concepts sometimes. So we need pictures!