javascript - 视差效果在某些浏览器中不起作用

Question

大家好，我只使用 CSS 和 HTML 制作视差效果。我正在为桌面测试它，它适用于:Chrome、Firefox、IE 和 Spartan。

但我在移动测试中遇到了困难。目前来 self 的 Nexus 5:

Firefox:有效；Chrome:不工作；

它在 iOS 版 Chrome 上运行(目前仅在 ipad mini 上测试过)

这是版本中的错误吗？或者我遗漏了什么？

这是一个实时预览:

live demo

这里是我提取出来的一个js文件供大家测试:

jsfiddle demo

<div id="title" class="slide header"></div>
<div class="slide"></div>

.slide {
   position: relative;
   min-height: 100vh;
   width: 100vw;
}

#title {
   background-image: url("http://i.imgur.com/LzOCzLr.jpg");
   background-attachment: fixed;  
}

更新:不适用于 Android 版的 Chrome Mobile

Answer 1

删除 position:fixed 然后试试这个: https://jsfiddle.net/aatpa7qd/4/

$('body').scroll(function(){
  $("#title").css({"background-position":"center " +($('body').scrollTop()*0.65) + "px"});
});