在我的页面上,我也嵌入了来自vimeo的视频
<h4>Favopurite songs</h4>
<ul>
<li>
<a href="https://player.vimeo.com/video/9159308?autoplay=1" target="vimeoPlayer">
Three little birds
</a>
<li>
</ul>
<section id="player">
<iframe class="first" src="#" name="vimeoPlayer" width="200" height="150"
frameborder="1" webkitallowfullscreen mozallowfullscreen allowfullscreen>
</iframe>
</section>
对于CSS我有
iframe {filter: grayscale(100%)}
这适用于所有浏览器,但不适用于Internet exploere 11。
我知道,自从Internet探索10以来,他们删除了filter属性。
我碰到过许多建议用于图像的 fiddle ,它们对它们具有悬停效果。
我纯粹是在为嵌入式视频添加灰度滤镜,而没有任何悬停效果,我发现有些小玩意儿无法用于嵌入式视频。
任何帮助将不胜感激,谢谢
最佳答案
用于不同的浏览器
iframe{
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
}
现在在IE11中进行测试。
如果IE 11不支持CSS过滤器,则必须使用javascript解决方案来执行相同的操作。
cross browser grayscale
该链接详细说明了此过程,使用现代化工具检测浏览器等。但是要实现它需要做很多工作。