diff --git a/index.html b/index.html
index bb0421c..4ea0b3d 100644
--- a/index.html
+++ b/index.html
@@ -722,10 +722,21 @@
Drag empty space to select — Shift adds, Alt subtracts
window.sortables = [];
window.resortableLoaded = true;
+ // Touch tuning shared by every demo below.
+ // The library default is delayOnTouchOnly: 200ms / touchStartThreshold: 5px.
+ // That 5px cancel-threshold is so tight that a natural drag motion (press +
+ // immediately move) blows past it before the 200ms hold elapses, so the
+ // pending drag is cancelled and the gesture falls through to a PAGE SCROLL.
+ // Snappier hold (150ms) + a forgiving 15px tolerance means a deliberate
+ // press-and-drag reliably starts a drag, while a fast swipe — which covers
+ // far more than 15px well under 150ms — still scrolls the page.
+ const TOUCH = { delayOnTouchOnly: 150, touchStartThreshold: 15 };
+
// Smooth Transitions
const smoothList = document.getElementById('smooth-list');
if (smoothList) {
window.sortables.push(new Sortable(smoothList, {
+ ...TOUCH,
animation: 300,
draggable: '.sortable-item',
easing: 'cubic-bezier(0.4, 0, 0.2, 1)',
@@ -742,6 +753,7 @@ Drag empty space to select — Shift adds, Alt subtracts
const multiSelectList = document.getElementById('multi-select-list');
if (multiSelectList) {
window.sortables.push(new Sortable(multiSelectList, {
+ ...TOUCH,
animation: 200,
draggable: '.sortable-item',
multiDrag: true,
@@ -754,6 +766,7 @@ Drag empty space to select — Shift adds, Alt subtracts
const keyboardList = document.getElementById('keyboard-list');
if (keyboardList) {
window.sortables.push(new Sortable(keyboardList, {
+ ...TOUCH,
animation: 200,
draggable: '.sortable-item',
multiDrag: true,
@@ -768,6 +781,7 @@ Drag empty space to select — Shift adds, Alt subtracts
const marqueeList = document.getElementById('marquee-list');
if (marqueeList) {
const marqueeSortable = new Sortable(marqueeList, {
+ ...TOUCH,
animation: 200,
draggable: '.sortable-item',
multiDrag: true,
@@ -780,6 +794,7 @@ Drag empty space to select — Shift adds, Alt subtracts
// Kanban
const kanbanOptions = {
+ ...TOUCH,
group: 'kanban',
animation: 200,
draggable: '.kanban-card',
@@ -794,6 +809,7 @@ Drag empty space to select — Shift adds, Alt subtracts
const imageGallery = document.getElementById('image-gallery');
if (imageGallery) {
window.sortables.push(new Sortable(imageGallery, {
+ ...TOUCH,
animation: 300,
draggable: '.gallery-item',
ghostClass: 'sortable-ghost',
@@ -806,6 +822,7 @@ Drag empty space to select — Shift adds, Alt subtracts
const nestedList = document.getElementById('nested-list');
if (nestedList) {
window.sortables.push(new Sortable(nestedList, {
+ ...TOUCH,
animation: 200,
draggable: '.folder',
handle: '.folder-header',
@@ -814,6 +831,7 @@ Drag empty space to select — Shift adds, Alt subtracts
}));
}
const folderOptions = {
+ ...TOUCH,
group: 'files',
animation: 150,
draggable: '.file',