使用jQuery的字体大小在iPhone上不起作用

简单地说，我要做的是编写一个jQuery，根据屏幕的宽度设置三个div的

字体大小

我已经在Chrome、Safari和Firefox的桌面上测试了这些代码，它们都运行良好，可以很好地上下扩展。当在iPad上测试时，它工作正常——包括Chrome和Safari。但当我在iPhone上测试它时，一切都崩溃了

当页面加载到Safari上时，js似乎什么都不做，字体大小也没有改变。但奇怪的是，当你旋转iphone时，字体的大小确实会变为页面第一次放置时的正确大小，尽管我还没有编写
.trigger
函数

让我更困惑的是，在iPhone上使用Chrome浏览器查看网页时，它似乎起作用

我不明白为什么我的代码不想在iPhone上运行

这是我的jQuery

//Gather the screen width and height
var screenwidth = $(window).width();
var screenheight = $(window).height();

// set the width and height of the box based on the screen width and height
var boxwidth = screenwidth - 80;
var boxheight = screenheight - 200;

$("#box").width(boxwidth);
$("#box").height(boxheight);

//center the box along the X and Y axis
var boxX = (screenwidth / 2) - (boxwidth / 2);
var boxY = (screenheight / 2) - (boxheight / 2);

$("#box").css({"margin-top" : boxY});
$("#box").css({"margin-left" : boxX});

//set the font size of each div based on the screen width
var box1font = Math.floor( (screenwidth / 100) * 8.8 );
var box2font = Math.floor( (screenwidth / 100) * 6 );
var box3font = Math.floor( (screenwidth / 100) * 1.6 );

$("#box1").css("font-size" , box1font);
$("#box2").css("font-size" , box2font);
$("#box3").css("font-size" , box3font);

//center the divs within the parent element
var inner = $("#wrapper").height();

var innerX = (boxheight / 2) - (inner / 2);

$("#wrapper").css({"padding-top" : innerX}); 

请尝试将CSS属性
-webkit text size adjust:none
添加到您的页面。
请不要在问题中包含“非常感谢帮助”。这是无用的噪音。谢谢@freejosh，刚刚试过，似乎已经成功了！