Skip to content
Permalink
Browse files

layout demo: add new components via cloned draggables, connected to s…

…ortables
  • Loading branch information
jzaefferer committed Sep 3, 2008
1 parent 6174fef commit 7084fa079da7315ee9e3eabfa1abd6009837bb76
@@ -41,6 +41,6 @@ dl.sort dt span.options a.disabled { background:#555 !important; cursor:default;
#content { float:left; width:400px; }
#sidebar { float:left; width:200px; }
#footer { width:638px; }
#trashcan { float:left; }
#meta { float:left; }

#trashcan p { margin:0; }
@@ -81,11 +81,15 @@
//placeholder: 'placeholder',
connectWith: els,
start: function(e,ui) {
ui.helper.css("width", ui.item.width());
ui.helper.css("width", ui.item.parent().width());
},
change: sortableChange,
update: sortableUpdate
});
$('#components > dl').draggable({
connectToSortable: $els,
helper: 'clone'
})
});

$(window).bind('load',function(){
Binary file not shown.
@@ -68,9 +68,24 @@ <h2>Footer</h2>
</div>
</div>

<div id="trashcan" class="ui-sortable">
<h2>Trash can</h2>
<p>Drag modules here to delete them.</p>
<div id="meta">
<div id="components" class="ui-sortable">
<h2>Components</h2>
<dl class="sort">
<dt>Subheadline</dt>
<dd>Paragraph</dd>
</dl>
<dl class="sort">
<dt>Image</dt>
<dd><img src="img01.png" /></dd>
<dd>Caption</dd>
</dl>
</div>

<div id="trashcan" class="ui-sortable">
<h2>Trash can</h2>
<p>Drag modules here to delete them.</p>
</div>
</div>

<div class="clear"></div>

0 comments on commit 7084fa0

Please sign in to comment.
You can’t perform that action at this time.