Discussion :

[Harmonic]

Bonjour !

Je suis actuellement en stage de développement web et j'avais pour objectif de réaliser un site asp avec la gestion de widgets.

Pour cela j'ai utilisé une simple page html déjà existante qui est:
http://james.padolsey.com/demo/tut-i...-with-cookies/

Le problème est que l'on vient de me demander de rendre ma page asp compatible avec le tactile. C'est à dire que les widgets seraient déplaçables avec le doigt par exemple.

J'ai fait des recherches sur internet et j'ai appris l’existence d'un hack nommé "touch-punch" disponible ici:
http://touchpunch.furf.com/

J'ai alors testé de l'inclure en espérant que ça marche mais malheureusement non

Je voulais donc savoir si vous seriez comment rendre cette page à coup sur compatible tactile sachant que comme vous pouvez le constater cette page utilise une librairie jquery-ui personnalisée... Je bloque dessus depuis 3 jours...

Merci beaucoup !

[Harmonic]

Rebonjour, je viens de trouver la solution, je vous la donne ça peut toujours être utile

fonction javascript:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
 
function touchHandler(event) {
    var touch = event.changedTouches[0];
 
    var simulatedEvent = document.createEvent("MouseEvent");
    simulatedEvent.initMouseEvent({
        touchstart: "mousedown",
        touchmove: "mousemove",
        touchend: "mouseup"
    }[event.type], true, true, window, 1,
        touch.screenX, touch.screenY,
        touch.clientX, touch.clientY, false,
        false, false, false, 0, null);
 
    touch.target.dispatchEvent(simulatedEvent);
    event.preventDefault();
}

Et dans une fonction init() chargée dans une page_load via un ScriptManager:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
function init() {
 
 
    var forEach = Array.prototype.forEach,
    $$ = document.querySelectorAll.bind(document);
 
    forEach.call($$('#columns .widget'), function (v) {
        v.addEventListener("touchstart", touchHandler, true);
        v.addEventListener("touchmove", touchHandler, true);
        v.addEventListener("touchend", touchHandler, true);
        v.addEventListener("touchcancel", touchHandler, true);
    });
}

[danielhagnoul]

Il y a des plugins.

Exemple : jQuery-Mobile-Events.

[Harmonic]

merci danielhagnoul Par ailleurs avec la méthode que j'ai utilisé, je me retrouve dans l'impossibilité d'éditer le widget c'est à dire réduire ou supprimer. J'ai juste ciblé vers .widget .widget-header mais affecter des events me bloquent certains script apparemment Comment peut-on contourner ça ? J'ai essayé l'ajout d'un span ciblé aux titres des widgets mais ça ne marche pas :/