I'm using a bit of jQuery code to allow click and drag creation of boxes, how can I create them programatically?

In this 开发者_StackOverflowbit of jQuery, you can click and drag in the white area to create boxes.

How can I add the boxes programatically? Thanks for reading.

Simply create a new with the correct class and css styles and append to the appropriate parent element on the page...

$('<div></div>').addClass('ui-boxer')
                .css({ border: '1px solid white', 
                       background: 'orange', 
                       padding: '0.5em', 
                       position: 'absolute', 
                       'z-index': 100,
                       left: 150, top: 150, 
                       width: 50, height: 50})
                .appendTo('body');