The issue is some browsers ( looking at you in particular Safari ), dont necessarily take any notice of your meta tags. In my JAQ intranet application, I use the following java to resize the page to the browser window on mobile devices. Its not perfect. In the body tagI call a function like this.... <body onLoad="PageZoom();"> <div style="width:330px; margin:auto;" id="PageDiv"> Blah blah That div encases the entire page in the body tag. You can control the width with that style "width:330px", but its not necessary. In this case its a generic mobile phone width so I can check th epages looks ok on a mobile screen as I develop the page. Then elsewhere on the page, usually in the header somewhere, I have... <script language="javascript">
function PageZoom(){
var DivW=document.getElementById("PageDiv").offsetWidth;
var PageW=window.innerWidth;
Z= Math.round(PageW / DivW * 95);
Zstring=Z.toString() + "%";
document.body.style.zoom = Zstring;
document.getElementById("PageDiv").focus();
}
</script>
Once the page has loaded, it gets the width of the div "PageDiv", and then adjusts the zoom to suit. Glenn Edited 2025-10-05 11:27 by Gizmo |
