我正在研究一个我下载的视差网页模板,它有背景图像的div,视差和漂浮在其他较低的z-index内容上.
@H_403_2@每当我在下方区域使用他们的iFrame代码嵌入Vimeo或YouTube视频时,一旦浮动div“触摸”嵌入式播放器,视差将在y方向上跳跃的背景图像.我认为与Flash有关的问题最终被嵌入为具有正常页面嵌入的iFrame按预期工作 – 随意尝试.
@H_403_2@这只发生在Chrome和Safari中. Firefox和IE按预期工作.我已经从我的网页模板中创建了一个精简的JSFiddle来说明问题.在上面的浏览器中尝试一下,你可以看到问题发生 – 只需滚动一下结果.
@H_403_2@http://jsfiddle.net/wU2DU/2/
@H_403_2@太多代码 – 只看JSFiddle – 这是查看问题的最简单方法
@H_403_2@我真的想找到一个解决办法,因为我已经设计了我的整个网站,现在才注意到Chrome和Safari中的这个问题.
@H_403_2@注意：问题不在于视差JS代码.我离开那里就是这样可以看出效果.没有该代码,背景图像仍会弹出.
解决方法
你的嵌入代码源里面有wmode = opaque.使用这个嵌入它应该工作：
<iframe src="http://player.vimeo.com/video/60982085" frameborder="0" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen="" wmode="transparent"></iframe>@H_403_2@这是一个更新的小提琴：http://jsfiddle.net/fxv76/
