Hi Alan,
there are three important points:
- replace all "onmouse ..." and "onclick" events with "ontouch..." and "ontap"
- in the function that handles the dragging of elements, you must cancel the "ontouchmove" event in order to prevent the whole page scolling on touch devices
- because a touch device can detect multiple simultaneous touches, the (x,y) coordinates are held in an event's "changedTouches" array
You can see how these points have been implemented in the following files in the HotPot for Moodle 2.x
- attempt/hp/hp.js
- function HP_fix_event()
- attempt/hp/6/renderer.php
- function fix_js_clientXY()
- function fix_js_disable_event()
You can see the resulting modified code if you look at the source code of any JMatch or JMix exercise delivered by the HotPot, QuizPort or TaskChain modules. Look for the following functions:
- function beginDrag
- function doDrag
- function endDrag
regards
Gordon
Gordon