Highlighted

animate html canvas how to set Screen zoom with Javascript

Participant ,
Mar 29, 2020

Copy link to clipboard

Copied

I have made an AnimateCC HTML Canvas with input Elements. On Smartphone by clicking inside an input Element the Document is zoomed in. How can I zoom out with Javascript to see the complete canvas Element on the screen of the smartphone? In other words how can I scale the canas Element with Javascript. I put the Javascript in the first Frame.

Adobe Community Professional
Correct answer by ClayUUID | Adobe Community Professional

Browser zoom is a user agent setting and therefore cannot be changed with JavaScript.

 

What you can do is add a viewport meta tag to prevent the browser from scaling the page.

https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag

 

TOPICS
Code, How to

Views

278

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

animate html canvas how to set Screen zoom with Javascript

Participant ,
Mar 29, 2020

Copy link to clipboard

Copied

I have made an AnimateCC HTML Canvas with input Elements. On Smartphone by clicking inside an input Element the Document is zoomed in. How can I zoom out with Javascript to see the complete canvas Element on the screen of the smartphone? In other words how can I scale the canas Element with Javascript. I put the Javascript in the first Frame.

Adobe Community Professional
Correct answer by ClayUUID | Adobe Community Professional

Browser zoom is a user agent setting and therefore cannot be changed with JavaScript.

 

What you can do is add a viewport meta tag to prevent the browser from scaling the page.

https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag

 

TOPICS
Code, How to

Views

279

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Mar 29, 2020 0
Adobe Community Professional ,
Mar 29, 2020

Copy link to clipboard

Copied

Your question is confusingly phrased. Do you want to zoom in then zoom back out, or do you want to not zoom at all?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Mar 29, 2020 0
Participant ,
Mar 30, 2020

Copy link to clipboard

Copied

Excuse my bad english.

Take a look at this example on a smartphone I hope this will show the problem

https://www.on-design.de/test/franz/win7.html

There are input Fields, when you play the game. The smartphones zooms in as soon as the focus is in the input field. Even though I have put a big font-size for the input field. A big font-size is the normal procedure for stopping that zooming. But this does not work  for Animate CC (Jquery) input components.

So thats the problem. So As I cant stop this automatic zooming. I am looking for a command to zoom out after the user has put some text in the input field, or after he has clicked a button.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Mar 30, 2020 0
Adobe Community Professional ,
Mar 30, 2020

Copy link to clipboard

Copied

Browser zoom is a user agent setting and therefore cannot be changed with JavaScript.

 

What you can do is add a viewport meta tag to prevent the browser from scaling the page.

https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag

 

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Mar 30, 2020 1