538719 jQuery Resize/Delete Page Blocks 2

In Progress

This is the 1st part of a bigger project. Please see the attached screenshot. It shows a page layout grid dividing in 6 rows by 3 cells each row. What I want:

1.- The user to be able to remove any block by clicking the remove icon.

2.- The user to be able to resize the blocks so he can fill the empty space of a removed block.

3.- Three buttons under the layout:

3a- Save layout (using divs and not table)

3b- Undo last action

3c- Start again

This way a user will be able to design a page layout. Putting content there is another part of the project. Some points that need attention.

1.- For easy manipulation the container will has fixed dimensions (lets say 600width X 800 height). But this is only for an easy design. The code must have width:100% (the container) and the rows width relative (eg: width:40%). The height will be always auto, to be able to show all the content.

2.- For the same reason there is a border in the cells. The code must be border less, but in edit mode it must appears again.

3.- Except the original Add/Save code, must be a function Retrieve/Edit/Update. Server side language: PHP. Database: MySQL

Thank you

Skills: Anything Goes, Editing, Graphic Design, Icon Design, Javascript, jQuery / Prototype

See more: icon table for design, grid layout graphic design, grid graphic design, grid for icon design, graphic design jquery, graphic design grid layout, graphic design grid, container graphic design, javascript page edit, edit page javascript, page border design, design of page border, jquery grid, design three icon, jquery easy, page grid, can save code database, graphic jquery, php jquery grid, mysql delete, jquery buttons show, remove block, original page auto, php delete mysql row, jquery grid buttons

Project ID: #2284660