Question

我有一个与iframes / Youtube视频相关的BUG＆amp;铬...

得到了一个div

<div id="single">
      <div id="poza-mare">
        <div class="items">
              <div><iframe width="710" scrolling="no" height="360" frameborder="0" src="http://www.youtube.com/embed/CblqeBA0iIk" type="text/html"></iframe></div>
              <div>...</div>
              <div>...</div>
        </div>
      </div>
</div>

#poza-mare{position:relative;overflow:hidden;clear:both;height:360px;}
#poza-mare div {float:left;display:block;width:710px;}
#poza-mare .items {width:20000em;clear:both;margin:0;padding:0;position: absolute;}
#single{width:710px; overflow:hidden; margin:0 auto;z-index:2;}

无论如何，项目类中的div是由Scrollable jQuery制作的，当iframe向左滚动时它根本不想被隐藏（当其他一切被隐藏时它只是保持可见）。这只发生在Chrome中，在Firefox / Safari / IE9 / Opera中完美运行。

我能做些什么才能让它发挥作用？：（

链接：http://lesateliersnomad.com/showcase/2d-animation/artmania-festival-2010/

提前致谢！

Answer 1

youtube视频中的“?wmode=opaque”将修复帧问题。 :)

Answer 2

尝试通过在滚动之前添加{ zoom: 0.99999 }并在之后添加{ zoom: 1 }来修复它。这个黑客帮助了我。 :)

Answer 3

如上所述：overflow: hidden; doesn't work on Chrome with IFRAMEs?

您只需要滚动属性<iframe scrolling='no' src='..'> </iframe>

经过测试和工作。

Chrome溢出：隐藏＆amp; iframe BUG

3 个答案: