iPad touch interection

touch
interaction

#1

hello,
I am working on mouse interaction for desktop / touch interaction for iPad / iphone.
I wonder how to stop default interaction which moves canvas by touch.

When I touch it with Orbit Control like this example.
https://threejs.org/examples/#webgl_animation_cloth
The canvas is not moved by touch movement.

But with this example which is without orbit control like bellow one,
The canvas is moved by virtical touch movement.

I am not using Orbit Control and disable this movement for my project.
https://threejs.org/examples/#webgl_animation_keyframes_json
how Can I do this?

Thanks in advance,
Hori


#2

In the example with THREE.OrbitControls(), controls instantiated with var controls = new THREE.OrbitControls( camera, renderer.domElement );

Quote from the documentation:

All event listeners in the controls are added to that element, which passed in the second parameter. Here and here.

So, you need to add all your event listeners (for touch events and for mouse events) to renderer.domElement.
Actually, you can take a look into the source code of THREE.OrbitControls() and see how the things work :wink:


#3

Just google something like “html5 canvas prevent scrolling”. There are many stackoverflow threads about that topic e.g.


#4

thank you.
This helped me.

Hori