Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Set default 100% zoom for iOS safari site rendering

My web page is slightly larger then the iPad resoltion, so when I open it in iPad Safari window, it is horizontally scrollable. When I pinch out the view, the web site looks perfect. Can I, via setting some tags like viewport or some other, get the page to be fully displayed as soon as it loads?

like image 554
Maxim V. Pavlov Avatar asked Sep 11 '12 13:09

Maxim V. Pavlov


2 Answers

In this way:

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

Documentation: http://developer.apple.com/library/ios/#DOCUMENTATION/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html

like image 73
Andrea Turri Avatar answered Nov 03 '22 01:11

Andrea Turri


This stops the user from being able to re-scale the page as well, you can toggle this by changing user-scalable to 1 or limiting the amount of scalability by changing maximum-scale

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">
like image 29
CᴴᵁᴮᴮʸNᴵᴺᴶᴬ Avatar answered Nov 03 '22 00:11

CᴴᵁᴮᴮʸNᴵᴺᴶᴬ