使用JavaScript检测iOS和更改CSS

我有一个网站。我在这个网站上问了很多问题，因为我尝试了很多不同的方法来创建完美的非代理网站克隆脚本

这（但愿！）将是这件事的最后一个问题。最后一个问题是iOS。有一种奇怪的滚动效果，你可以继续在你通常能看到的页面的主要区域进行过度滚动/橡皮筋。这意味着您可以看到通常隐藏在

边缘后面的东西。在我的例子中，如果你使用iOS，尤其是safari，你可以在iframe上向上滚动，看到我用于主页的“CMS”中的广告横幅，我将iframe的50个像素设置为隐藏在页面顶部上方

我需要为iOS加载一个单独的样式表来解决这个问题 这使得页面和iframe非常长，然后阻止人们在iframe内滚动，但允许他们滚动主体，允许他们看到iframe的其余部分，因为它位于非常长的页面上的固定位置

首先，我如何让用户不能在iframe中滚动（它是跨域的，我对它没有太多控制权），但仍然可以触摸其中的按钮

第二，如何使用JavaScript更改CSS？以下是我迄今为止尝试过的代码：

var\u iOSDevice=！！navigator.platform.match（/iPhone | iPod | iPad/）；
如果（_iOSDevice=='true'）{
document.html.style.height=“400%”；
document.html.style.overflow=“隐藏”；
document.maincode.style.min-height=“计算（1000%+50像素）”；
警报（“正在使用iOS”）；
}否则如果（_iosdevidence=='false'）{
警报（“未使用iOS”）；
}

您可以使用vanilla js在html元素中添加或删除css类：

var element = document.querySelector('div[id=divId]');
element.setAttribute('class', 'class1 class2 class3'); // Set the classes

您可以使用vanilla js设置样式：

element.setAtttribute('style', 'top:33px;background-position: 1251px 0px;'); // add your custom css

您可以使用jQuery添加或删除css类：

$('div#divId').addClass('hidden');
$('div#divId').removeClass('hidden');

我看了你的页面，我想你想阻止用户向上滚动，但让他们向下滚动？如果是这样，您可以通过设置display:none来隐藏该元素

---

当我在iPhone上为Safari做一些开发时，我发现在页面底部有一个javascript控制台（hnl.mobileconosole.js）用于调试非常方便。

这是否回答了您的问题？我认为使用媒体查询会更干净、更容易做到这一点。媒体查询无法区分iOS和Android，是吗？如果显示分辨率改变，他们将无法检测到它。我需要使用JavaScript，因为如果使用任何不是Mac的iDevice，则需要使用新的CSS。我无法更改iframe内部的CSS，因此我不确定您的向下滚动解决方案是否有效。。。