How do I code a GUI Selection Box?

I want to build into my app a way to select multiple objects on the screen (this is an HTML page with a bunch of absolutely positioned HTML divs). You know, like when you click down with the mouse and drag a transparent/translucent box and anything wit开发者_高级运维hin that box gets selected upon mouse release?

I don't know how to go about coding that. How would you? Or pointers to solutions is acceptable as well.

Consider using jQuery javascript library. It has an extension jQuery UI that provides abstractions for interaction and animation. For drag an drop you have: Draggable

Here is what I would do.

Mousedown creates a high z-index div, transparent body with a nice border, which has its dimensions informed by mousemove. On mouseup you compare the region of that div with applicable elements. This wouldn't be particularly hard to do without a library, but YUI3 makes it pretty simple, have a look at http://developer.yahoo.com/yui/3/api/Node.html#method_inRegion

HTH.