March 2013 – Optimize iPad

1.Optimize for iPad by changing the viewport, adding to the header
 <meta name=”viewport” content=”width=device-width; initial-scale=0.8; minimum-scale=0.8; maximum-scale=1.0; user-scalable:no;”> .

2. Added iOSZoom.js to the skin folder
var mobile_timer = false;
if (navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i)) {
$(‘#viewport’).attr(‘content’, ‘width=device-width,minimum-scale=1.0,maximum-scale=1.0,initial-scale=0.8′);
$(window).bind(‘gesturestart’, function () {
clearTimeout(mobile_timer);
$(‘#viewport’).attr(‘content’, ‘width=device-width,minimum-scale=1.0,maximum-scale=10.0′);
}).bind(‘touchend’, function () {
clearTimeout(mobile_timer);
mobile_timer = setTimeout(function () {
$(‘#viewport’).attr(‘content’, ‘width=device-width,minimum-scale=1.0,maximum-scale=1.0,initial-scale=1.0′);
}, 1000);
});
}

3. Added the following
<?php $User = $_SERVER['HTTP_USER_AGENT'];
if (strpos($User, ‘iPad’) !== false) { ?> <script> jQuery(“.nav-container #nav li:nth-child(2) > div > a”).attr(“href”,”#”); </script> <?php } ?>