How to enable pinch zoom on website for mobile devices?

Pinch zoom is a key feature of mobile browsing, which allow you to to zoom in to read content and out to locate content within a page. I am trying to enable this feature on my website. I’ve tried to enable zooming by setting meta viewport like this.

<meta name="viewport" content="width=device-width,initial-scale=1">

It’s working on my android smartphone(Sony) but it’s not zoomable on iPad and iPhone. My site www.pnrstatusbuzz.in is a php site, design in HTML5. Is this a designing issue or error in above mentioned code.

The viewport meta tag is correct. I am not familiar with the peculiarities of iThings, though, so someone else will need to evaluate that… possibly in about 11 or 12 hours.

Yes it is.

You can pinch and zoom that site ok on my iphone. It’s enabled by default.

1 Like

You might find it helps to validate your code. There are 72 errors or warnings on your home page, some of which may affect how your site displays on different devices.

1 Like

I guess the broken meta http-equiv tag might cause problems for older IE users.

The misplaced <style> block might mean some browsers don’t use the CSS in it.

The duplicate Id will likely cause CSS problems if you are using it as a selector and will almost certainly cause JavaScript problems.

How a browser compensates for the mismatched <div> and <span> tags is unpredictable.

I think you should at the least fix those.

https://validator.w3.org/nu/?doc=https%3A%2F%2Fwww.pnrstatusbuzz.in%2F

1 Like

When it comes to validation errors, I look at it like this: If you only have very few of them, it’s not such a big job to fix them, so you may as well just do it and be done with it.
On the other hand, if you have huge number of errors, then the page seriously needs some attention and you need to go to work fixing them.
What this amounts to is, either way, just fix the errors. :smiley:

4 Likes

Thanks pointing the issue with style and design, i will try to correct all these issue and validate it.

That will make no difference to the fact that your original issue of pinch and zoom is already working on the iphone and ipad. I have tested on both and both will pinch and zoom as required (although the site does need some work in other areas).

Either you misunderstand what pinch and zoom does or you mean something completely different? Where have you tested that pinch and zoom is not working? Perhaps it was disabled accidentally in the settings on the machine you checked (not that I’m sure there is such a setting).

Therefore fixing the errors will make no difference to pinch and zoom on ios devices because it is already working. However as others have pointed out it is most important to fix those errors anyway as it could cause other problems in various platforms/browsers.:slight_smile:

PaulOB Sir, you are absolutely right. I don’t have iPhone, so previously i have checked it on my friend device and it wasn’t working; may be it’s because of problem in his device or browser. After your reply i have checked it again on someone else iPhone, it was working perfectly. Thank you so much PaulOB.

3 Likes

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.