Is there a way I can put little squares around a div to make it look like handles, one top middle, top left, top right, middle left, middle right, bottom left, bottom right, bottom middle. I have this jquery plugin and I have a div resizeable, but I wanted to know how I could make it look like it has handles. Most likely in css, but maybe theres a way in jquery? Open to either suggestions. Thanks!
+2
A:
If your <div> is not static-ally positioned, (position: relative works too) then anything within it which is absolute-ly positioned will refer to it. Makes nice handles.
Evadne Wu
2010-07-04 08:38:41
could you give me an example?
anthonypliu
2010-07-04 08:40:45
parent set position:relative, 8 children set position:absolute and has top, right, bottom and left spacing valued respectively in 0%, 50% or 100%. Border images might work, but that means you’re baking how the handles look into something larger.
Evadne Wu
2010-07-04 08:59:46
A:
Depending on your app, (and what you need to support) the CSS3 property border-image may be an option. If the border is used to indicate JavaScript functionality, this CSS would be best applied with JavaScript in a progressively enhanced manner.
John McCollum
2010-07-04 08:44:35
A:
You just need a bottom-right positioned background image. See http://jqueryui.com/demos/resizable/
Check the jQuery UI Resizable demo - see how they've done it?
Marko
2010-07-04 08:50:19