Firefox：包含嵌入YouTube视频的滚动iframe-Java 学习之路

Scenario

我的页面 p1 包含一个iframe . iframe指向包含来自youtube的嵌入视频的页面 p2 .

Problem

问题是，如果我在iframe中滚动（通过鼠标）页面，只有当鼠标光标不在youtube embdedded视频上时，它才会正常滚动 .

但如果鼠标光标位于youtube嵌入式视频上，则iframe内的页面 p2 将停止滚动，而外部页面 p1 开始滚动 .

怎么能避免这种不正常的行为？

我希望即使鼠标光标位于youtube嵌入视频上，iframe内的页面也会继续正常滚动，并且不会松开鼠标滚轮事件 .

Failed solutions

我尝试将属性 wmode="transparent" 添加到youtube嵌入式视频的iframe标记中，但它无法解决问题 .

Details

要在iframe中滚动，我使用的是一个替代滚动条的插件 .

Demo

你可以找到演示here . 用Firefox打开它，然后用iframe滚动鼠标

2 回答

找到解决方案，观察Facebook代码 .

基本上，我没有使用iframe来嵌入youtube视频，而是使用 <embed> 标记，如下面的代码：

<embed  wmode="opaque" salign="tl" allowscriptaccess="never" allowfullscreen="true" scale="scale" quality="high" bgcolor="#FFFFFF" name="swf_u_jsonp_2_2b" id="swf_u_jsonp_2_2b" style="display: block;" src="https://www.youtube.com/v/XvLAKrVbCBM?version=3&autohide=1" type="application/x-shockwave-flash">

回复于 2024-04-28T18:08:43+08:00

1
除了@Kaarel Kont-Kontson建议的解决方案之外，我没有找到解决方案 . 如果我在视频顶部放置一个div，用户可以播放视频，即使鼠标光标在视频上也可以滚动 .

具体来说，以下是显示单个视频的div：
```
<div style="position:relative; height:200px; width:200px;">
        <iframe style="position:absolute;width:100%;height:100%;z-index:-10;" src="//youtube.com/embed/dooCQdg9-NA"></iframe>
        <div style="height:100%;width:100%;position:absolute;z-index:20;"></div>
    </div>
```
回复于 2024-04-28T18:08:43+08:00

Firefox：包含嵌入YouTube视频的滚动iframe

2 回答

相关问题