Touchscreen content scaling and dragging

  • 1
  • Question
  • Updated 3 years ago
  • Answered
Hi Community,

I am looking for an advice and at the same tame have a suggestion/idea for RV. So, I am working on that interactive directory. All is good, but I do not want users to be able to start messing' with content by scaling or dragging it. I looked up HTML solutions for scaling, but did not try it yet. Before I do so, I would like to ask for some guidance from more experienced content creators. What is the best way to address this problem? Also, if it is just a code problem, would not it be nice to have this optional from RV presentation settings?
Photo of Darius - PRODO.us

Darius - PRODO.us, Champion

  • 26,850 Points 20k badge 2x thumb

Posted 3 years ago

  • 1
Photo of mlm

mlm, Official Rep

  • 4,624 Points 4k badge 2x thumb
Im not exactly sure what you mean by "scaling", but we have added this css to the head of the html for the presentations to disable users from dragging images around. 

<style type="text/css">    body {
user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
-khtml-user-select: none;
   }
  
</style>  
Photo of Darius - PRODO.us

Darius - PRODO.us, Champion

  • 26,850 Points 20k badge 2x thumb
Thank you mlm,

That will help me too. By "scaling" I mean when you put two fingers on a screen and drag them apart. That will increase the scale of DOM. For that I have this (have not tried yet): "<meta name="viewport"
content="width=device-width, initial-scale=1.0, user-scalable=no">"

The problem I still have to tackle is after you long-pressed a finger on a screen you can drag DOM to the left once and then to the right (not sure what that is). This sort of 'refresh' the page. But I am allowed to do that only once one direction. No DOM dragging vertically up or down, though.

Basically all I want to achieve is that users were able to click buttons and that is it. No funny business.
Photo of mlm

mlm, Official Rep

  • 4,624 Points 4k badge 2x thumb
That will be most likely something you will need to achieve by configuring your hardware/os you are running not the content. I know we have had to deal with various windows 10 menus and what not that will popup due to certain user interaction.
Photo of Darius - PRODO.us

Darius - PRODO.us, Champion

  • 26,850 Points 20k badge 2x thumb
So I realized that dragging sideways works as going through Chromes's browsing history. Any ideas how to disable that?
Photo of Darius - PRODO.us

Darius - PRODO.us, Champion

  • 26,850 Points 20k badge 2x thumb
Thanks Robb, I will try this too. According to ELO support I can disable that in their monitor drivers settings.

I'm just curious Robb, what bran touchscreen monitors are you using?
Photo of Robb

Robb, Official Rep

  • 76,676 Points 50k badge 2x thumb
The ones I test on are Dell ST2220T's, but I know other users have used the Dell 2240 T's to test on. 
Photo of Darius - PRODO.us

Darius - PRODO.us, Champion

  • 26,850 Points 20k badge 2x thumb
Robb,

I double-checked, but disabling  "Overscroll history navigation" did not solve the problem. Not sure why. Did you test it; did is work for you?

As I mentioned before, both scaling/zooming and sideways dragging/sliding problems were fixed with ELO monitor drivers' settings: "Singe Touch Mode" to disable scaling and "Touch Mode: Click on Touch" to disable sliding.dragging.
Photo of Robb

Robb, Official Rep

  • 76,676 Points 50k badge 2x thumb
Darius, 

We haven't tested this solution yet, we were going to tomorrow. If I understand you correctly, you are saying this was corrected with new monitor drivers in your case, is that correct?
Photo of Darius - PRODO.us

Darius - PRODO.us, Champion

  • 26,850 Points 20k badge 2x thumb
Robb,

That is correct. ELO monitors have this software-control panel where you can set how touch is processed. But, please, let us know if fiddling with Chrome browser settings worked for you.
(Edited)
Photo of Dave

Dave

  • 2,836 Points 2k badge 2x thumb
I know this is probably not as helpful as one might hope, but I created a similar directory app in Tumult Hype.

I disbabled the user interactions i did not want (like pinch / zoom). Exported as an HTML Folder, then hosted the folder on AWS S3. I then altered the RV presentation to open the S3 html in a placeholder.

Takes the scope of control away from rv. Also implies use of a third party tool. Might be an unattractive option.