javascript - CSS、jQuery 和 JavaScript 在 iPhone iPad 上无法正常工作

Question

我刚刚完成我自己网站的编程，我将它上传到我在 GoDaddy 上的主机，在电脑和我的安卓手机上看起来不错，但在 iPhone 和 iPad 上一切都是错误的。我有一些视差效果、固定背景和一个在到达视口(viewport)顶部时上升并固定位置的菜单，这些都不适用于这些设备。

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

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

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

Answer 1

问题是 IOs 设备关闭了所有移动功能，以实现 iPhone 和 iPad 在浏览网站时的平滑滚动。

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

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

Js

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

CSS

.ios-background{
    backgorund-attachment: scroll
}