Mar*_*nna 17 css youtube html5 ipad ios
这是我通过蛮力设法解决的错误,但我不明白为什么解决方案有效.
问题是嵌入式YouTube视频在横向视图中没有在iPad(在iOS7中测试)上的特定(响应)网站上工作.我设法将其缩小到特定的CSS规则,当浏览器足够宽时,它会在标题中显示搜索输入,因此它将显示在iPad的横向视图中,但不会显示在纵向视图中.
在稍微蛮力摆弄之后,我发现type="search"
从输入标签中删除(导致它回落到默认值type="text"
)将解决问题.我的所有搜索都没有提出解释为什么这有效,或者甚至是其他任何经历过同样事情的人.
该网站的工作原理是首先显示图片,点击后可通过JavaScript替换YouTube iframe.在第一次点击之后,它将在桌面浏览器上自动播放,并且在iPad上它将加载视频但在用户再次按下它之前不会播放.
如果type="search"
输入是可见的(display: block;
),则点击嵌入的视频不会导致它播放; 水龙头没有明显的响应.如果我放大并点击顶部的控件,就像视频的名称一样,我可以看到它们被加下划线,测试显示没有元素覆盖iframe和拦截事件.
奇怪的是,点击iframe右侧的边缘会导致视频开始正常播放.否则,将iPad更改为纵向视图(导致通过CSS隐藏搜索输入)将启用iframe以便开始视频播放.在第一次单击之后,无论搜索输入是否显示,所有视频控件都将起作用.
我自己刚刚亲身经历过这一点,并想为您写下这篇文章表示我的敬意。你的问题,即使没有答案,也为我指明了正确的方向。
就我而言,这与 Youtube 无关。我在一个大型站点中有一个由 Drupal 生成的页面,其中站点范围的搜索机制使用自动完成的 drupal 模块,该模块作为type="search"
主要输入的类型。
在 IOS 中,用户报告称 Facebook、Twitter 和 Google Plus 各自的“点赞”按钮都不起作用,页面中嵌入的一个更大的有角度的应用程序也不起作用。他们都使用 iframe,但似乎都没有响应点击。
将这个看似无害、不相关的输入类型从 更改search
为text
立即解决了这个问题。
莫名其妙。
归档时间: |
|
查看次数: |
1823 次 |
最近记录: |