Ink Sketch, Touch Screen/Tablet, & Scrolling
Posted: 14 Aug 2017
I just thought I would share this little nugget of information with the community:
Requirement:
Allow users to annotate and photo within a Forms Designer form.
Solution:
Forms Designer can already do this. See here.
Problem:
When used on a tablet the web pages just scrolls and you don't get to draw on the image.
Fix:
CSS 3 to the rescue, just add a CSS to the Ink Sketch control like this:
My full CSS for annotating a photo is this:
Notes:
Do not put the touch-action tag on the Display form so that the page will scroll in Display form mode if they happen to press on the picture to scroll the page. The Edit and New pages scroll just fine as long as the user doesn't press down on the picture. We have tested it and this works just find for us in IE. Hasn't been tested in Edge, Chrome, Firefox, or Safari.
I hope this information will prove useful to someone in the future.
Thank you Plumsail for your very useful and superb products.
Requirement:
Allow users to annotate and photo within a Forms Designer form.
Solution:
Forms Designer can already do this. See here.
Problem:
When used on a tablet the web pages just scrolls and you don't get to draw on the image.
Fix:
CSS 3 to the rescue, just add a CSS to the Ink Sketch control like this:
Code: Select all
touch-action: none;
Code: Select all
background-size: contain;
background-repeat: no-repeat;
background-position: center;
cursor:default;
touch-action: none;
Do not put the touch-action tag on the Display form so that the page will scroll in Display form mode if they happen to press on the picture to scroll the page. The Edit and New pages scroll just fine as long as the user doesn't press down on the picture. We have tested it and this works just find for us in IE. Hasn't been tested in Edge, Chrome, Firefox, or Safari.
I hope this information will prove useful to someone in the future.
Thank you Plumsail for your very useful and superb products.