diff options
| author | Mario <mario@mariovavti.com> | 2021-08-03 07:12:35 +0000 |
|---|---|---|
| committer | Mario <mario@mariovavti.com> | 2021-08-03 07:12:35 +0000 |
| commit | cddc0217724f1a7661014d50e4c940e623a0c2dc (patch) | |
| tree | f24595d659adbb7d1e5d2e8e6dcd829b093887bb /library/Sortable/tests/nested.html | |
| parent | 571bae9d1c07bb08270163a314c91c138b42e62f (diff) | |
| download | volse-hubzilla-cddc0217724f1a7661014d50e4c940e623a0c2dc.tar.gz volse-hubzilla-cddc0217724f1a7661014d50e4c940e623a0c2dc.tar.bz2 volse-hubzilla-cddc0217724f1a7661014d50e4c940e623a0c2dc.zip | |
Apps drag and drop feature
Diffstat (limited to 'library/Sortable/tests/nested.html')
| -rw-r--r-- | library/Sortable/tests/nested.html | 67 |
1 files changed, 67 insertions, 0 deletions
diff --git a/library/Sortable/tests/nested.html b/library/Sortable/tests/nested.html new file mode 100644 index 000000000..f9dd15778 --- /dev/null +++ b/library/Sortable/tests/nested.html @@ -0,0 +1,67 @@ +<!DOCTYPE html> +<html> +<head> + <title></title> + <link rel="stylesheet" type="text/css" href="./style.css"> +</head> +<body> + +<div id="list1" class="list"> + <div>Item 1.1 + <div class="list n1"> + <div>Item 2.1</div> + <div>Item 2.2 + <div class="list n2"> + <div>Item 3.1</div> + <div>Item 3.2</div> + <div>Item 3.3</div> + <div>Item 3.4</div> + </div> + </div> + <div>Item 2.3</div> + <div>Item 2.4</div> + </div> + </div> + <div>Item 1.2</div> + <div>Item 1.3</div> + <div>Item 1.4 + <div class="list n1"> + <div>Item 2.1</div> + <div>Item 2.2</div> + <div>Item 2.3</div> + <div>Item 2.4</div> + </div> + </div> + <div>Item 1.5</div> +</div> + +<style> + .n1 > div { + background-color: lightblue; + } + + .n2 > div { + background-color: lightgreen + } + + .list { + padding: 50px; + } + +</style> + +<script src="../Sortable.js"></script> + +<script type="text/javascript"> + var elements = document.getElementsByClassName('list'); + + for (var i = 0; i < elements.length; i++) { + new Sortable(elements[i], { + group: 'shared', + invertSwap: true + }); + } +</script> + +</body> +</html> |