Modification du texte, du style et dequeerisation

js/floating.js

@@ -5,16 +5,19 @@ export function makeItFloat(target){
 
     let startX, startY;
     let clicked = false;
+    let selectedPointer;
 
-    startTarget.addEventListener('mousedown', (event) => {
-    startX = event.pageX;
-    startY = event.pageY;
-    clicked = true;
-    console.log('clicking...')
+    startTarget.addEventListener('pointerdown', (event) => {
+        selectedPointer = event.pointerId;
+        startX = event.pageX;
+        startY = event.pageY;
+        console.log('clicking...')
     })
 
-    document.addEventListener('mousemove', (event) => {
-    if(clicked){
+    document.addEventListener('pointermove', (event) => {
+    if(event.pointerId === selectedPointer){
+        event.preventDefault();
+        document.querySelector('html').style.overflow = 'hidden';
         console.log('moving...')
         let currentX = event.pageX;
         let currentY = event.pageY;
@@ -27,8 +30,15 @@ export function makeItFloat(target){
     }
     });
 
-    document.addEventListener('mouseup', () => {
-    console.log('STOP !')
-    clicked = false;
+    document.addEventListener('pointerup', () => {
+        console.log('STOP !')
+        selectedPointer = null;
+        document.querySelector('html').style.overflow = '';
+    })
+
+    document.addEventListener('pointercancel', () => {
+        console.log('STOP !')
+        selectedPointer = null;
+        document.querySelector('html').style.overflow = '';
     })
 }