JPT
/
dashboard
0
0
Fork 0
Code Issues Pull Requests Activity

[TASK] Implement basic drag&drop feature.

This commit is contained in:
Jan Philipp Timme 2013-09-11 16:25:43 +02:00
parent ec85bee1ac
commit 52f2f2bf54
2 changed files with 12 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
js/main.js
View File

@ -1,6 +1,6 @@
$(function() {
//setup the draggable content containers
$(".content-container").draggable({
$(".content-container-bounding-box").draggable({
"distance": 10,
"handle": "h1",
"helper": "clone",
@ -29,16 +29,15 @@ $(function() {
"scope": "widget",
"tolerance": "pointer",
"drop": function(event, ui) {
$(event.target).css("background-color", "");
console.log(["drop", event, ui]);
$("#draggable-temporary-clone").remove();
$(ui.draggable[0]).prependTo(event.target);
},
"over": function(event, ui) {
$(event.target).css("background-color", "hsla(0, 100%, 100%, 0.4);");
console.log(["over", event, ui]);
$("#draggable-temporary-clone").remove();
$(ui.draggable[0]).clone(true).attr("id", "draggable-temporary-clone").prependTo(event.target);
},
"out": function(event, ui) {
$(event.target).css("background-color", "");
console.log(["out", event, ui]);
$("#draggable-temporary-clone").remove();
}
});
@ -47,16 +46,15 @@ $(function() {
"scope": "widget",
"tolerance": "pointer",
"drop": function(event, ui) {
$(event.target).css("background-color", "");
console.log(["drop", event, ui]);
$("#draggable-temporary-clone").remove();
$(ui.draggable[0]).insertAfter(event.target);
},
"over": function(event, ui) {
$(event.target).css("background-color", "hsla(0, 100%, 50%, 0.4);");
console.log(["over", event, ui]);
$("#draggable-temporary-clone").remove();
$(ui.draggable[0]).clone(true).attr("id", "draggable-temporary-clone").insertAfter(event.target);
},
"out": function(event, ui) {
$(event.target).css("background-color", "");
console.log(["out", event, ui]);
$("#draggable-temporary-clone").remove();
}
});

2
style/main.css
View File

@ -69,7 +69,7 @@ h5 { font-size: 11pt; }
}
.content-column {
padding: 2em 1em 2em 1em;
padding: 2em 1em 0em 1em;
}
.content-container-bounding-box {