CSS、jQuery 和 JavaScript 在 iPhone iPad 上无法正常工作答案

【问题标题】：CSS, jQuery and JavaScript not working properly on iPhone iPadCSS、jQuery 和 JavaScript 在 iPhone iPad 上无法正常工作
【发布时间】：2016-06-14 19:13:51
【问题描述】：

我刚刚完成了我自己的网站的编程，我把它上传到了我在 GoDaddy 上的主机上，在电脑和我的 android 手机上看起来不错，但在 iPhone 和 iPad 上一切都错了。我有一些视差效果、固定的背景和一个在到达视口顶部时会上升并获得固定位置的菜单，这些在这些设备上都不起作用。

滚动接缝是最大的问题，当你向下滚动页面时，我有很多东西会移动或做一些事情，所有这些效果都只是在平滑滚动停止时应用，我阅读了一些关于 IO 上的滚动动量的内容设备和这个：

   overflow-y: scroll;
  -webkit-overflow-scrolling: touch;

是否有一些我不知道的元标记和前缀？我就是无法完成这项工作，在此先感谢。

【问题讨论】：

标签： javascript jquery ios css

【解决方案1】：

问题在于 IO 设备会关闭所有移动功能，以实现 iPhone 和 iPad 在浏览网站时的流畅滚动。

我为此找到的最佳解决方案是：http://markdalgleish.com/projects/stellar.js/demos/

另一个选项是检测用户代理是否在 iPhone 或 iPad 上，并使用此 jQuery 将 css 样式更改为具有视差或其他过渡效果的对象：

var userAgent = window.navigator.userAgent;
if (userAgent.match(/iPad/i) || userAgent.match(/iPhone/i)) {
    $('#banner').addClass('ios-background');
}

CSS

.ios-background{
    backgorund-attachment: scroll
}

【讨论】：