Community Learn Tools Library Leisure
search
English
Home > Web Front-end > H5 Tutorial > How to prevent mobile device (mobile phone, pad) browser from double-clicking to enlarge a web page_html5 tutorial skills

How to prevent mobile device (mobile phone, pad) browser from double-clicking to enlarge a web page_html5 tutorial skills

WBOY
Release： 2016-05-16 15:47:48
Original
2894 people have browsed it

Nowadays, browsers on mobile devices such as mobile phones or tablets have a double-click to enlarge setting by default. How can I prevent double-clicking to zoom in?

The viewport meta is provided on the Mobile page, which can be used to set zoom. But before using viewport, you need to change the document type of the page to Mobile type. The usual page DTD is XHTML or simple HTML5 declaration. Mobile devices should use the following declaration.

Copy code
The code is as follows:

After setting the DTD, you can use the viewport to disable zooming of the page. It is common to set user-scalable to 0 to turn off user scaling of the page view.

Copy code
The code is as follows:

But for better compatibility, we will use the complete viewport setting.


Copy code
The code is as follows:

If you need more detailed information about viewport, please refer to MDN

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

It seems that the DTD can only be declared as HTML5, and the viewport tag is added below

Related labels：
阻止双击放大
source：php.cn
Previous article：HTML5 realizes crystal clear raindrop special effects_html5 tutorial skills Next article：How the HTML 5 input placeholder attribute can perfectly serve as ie_html5 tutorial skills
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Latest Issues
function_exists() cannot determine the custom function Function test () {return true;} if (function_exists ('test')) {echo "test is function...
From 2024-04-29 11:01:01
0
3
2184
How to display the mobile version of Google Chrome Hello teacher, how can I change Google Chrome into a mobile version?
From 2024-04-23 00:22:19
0
11
2331
The child window operates the parent window, but the output does not respond. The first two sentences are executable, but the last sentence cannot be implemented.
From 2024-04-19 15:37:47
0
1
1961
There is no output in the parent window document.onclick = function(){ window.opener.document.write('I am the output of the child ...
From 2024-04-18 23:52:34
0
1
1845
Where is the courseware about CSS mind mapping? Courseware
From 2024-04-16 10:10:18
0
0
1897
Related Topics
More>
Popular Recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template