# How to create a click-only canvas? (disable movement, keep "pull down to refresh")

**URL:** <https://forum.babylonjs.com/t/how-to-create-a-click-only-canvas-disable-movement-keep-pull-down-to-refresh/9086>\
**Category:** Questions\
**Created:** [March 10, 2020, 12:01am UTC](https://forum.babylonjs.com/t/how-to-create-a-click-only-canvas-disable-movement-keep-pull-down-to-refresh/9086 "2020-03-10T00:01:28Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Arnaud\_H](https://avatars.discourse-cdn.com/v4/letter/a/839c29/32.png) [@Arnaud\_H](https://forum.babylonjs.com/u/Arnaud_H)\
**Post date:** [March 10, 2020, 12:01am UTC](https://forum.babylonjs.com/t/how-to-create-a-click-only-canvas-disable-movement-keep-pull-down-to-refresh/9086/1 "2020-03-10T00:01:28Z")

</div>

I am trying to render a scene on a mobile-oriented website, with the following features:

- Keep the “pull down to refresh”-functionality on mobile, so that when the user pulls down on the canvas, the page refreshes as it does on every mobile browser.

- Still have the (scene-embedded) buttons working when touched.

I googled this but could not find anything that worked. Any help?

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [March 10, 2020, 12:47am UTC](https://forum.babylonjs.com/t/how-to-create-a-click-only-canvas-disable-movement-keep-pull-down-to-refresh/9086/2 "2020-03-10T00:47:42Z")

</div>

if you do not need it, you might try to not attach the camera ?

you could also call in scene.detachControl() to detach any listener in the scene.

Then you could reattach only the part you need with scene.attachControl where the signature is as follow: attachControl(attachUp = true, attachDown = true, attachMove = true)

so you could try scene.attachControl(true, true, false) ?

---

<div class="post-metadata">

**Author:** ![Arnaud\_H](https://avatars.discourse-cdn.com/v4/letter/a/839c29/32.png) [@Arnaud\_H](https://forum.babylonjs.com/u/Arnaud_H)\
**Post date:** [March 10, 2020, 1:25am UTC](https://forum.babylonjs.com/t/how-to-create-a-click-only-canvas-disable-movement-keep-pull-down-to-refresh/9086/3 "2020-03-10T01:25:16Z")

</div>

Not attaching the camera seems to keep the objects from displaying. Adding scene.detachControl() does disable camera movement, but it does not allow for the pull-to-refresh functionality on mobile browsers.

EDIT: Pull-to-refresh does work on a regular canvas, so it should somehow be possible

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [March 10, 2020, 1:53am UTC](https://forum.babylonjs.com/t/how-to-create-a-click-only-canvas-disable-movement-keep-pull-down-to-refresh/9086/4 "2020-03-10T01:53:16Z")

</div>

I am pretty sure @RaananW will no a trick for this one 🙂

---

<div class="post-metadata">

**Author:** ![Arnaud\_H](https://avatars.discourse-cdn.com/v4/letter/a/839c29/32.png) [@Arnaud\_H](https://forum.babylonjs.com/u/Arnaud_H)\
**Post date:** [March 10, 2020, 2:09am UTC](https://forum.babylonjs.com/t/how-to-create-a-click-only-canvas-disable-movement-keep-pull-down-to-refresh/9086/5 "2020-03-10T02:09:45Z")

</div>

Found it! The missing piece was switching the [touch-action=“none”] attribute to [touch-action=“pan-y”] in combination with the detach/attach control functions mentioned in the first reply.

[touch-action=“none”] tells the browser to “Ignore all touch inputs on the canvas”, indicating they’ll be handled by underlying code. [touch-action=“pan-y”] tells the browser to “do its thing” when there’s y-axis scrolling happening on the page, in this case it would do the “pull-to-refresh” thing.

Thanks!
