mediaelement.js - 保持原始的 css 风格

Question

当我在具有特定样式（边距、浮动等）的音频或视频标签上使用 mediaelement.js 时，渲染效果不佳。

有没有办法在 mediaelement.js 渲染上保持原始 css 样式？

谢谢

Answer 1

我用这段代码解决了我的问题：

$(function(){ 
    $("video,audio").mediaelementplayer(); 
    $("video,audio").each(function(){ 
        $(this).parents(".mejs-container").css("float", $(this).css("float")); 
        $(this).css("float", "none"); 
        $(this).parents(".mejs-container").css("marginTop", $(this).css("marginTop")); 
        $(this).parents(".mejs-container").css("marginRight", (($(this).css("marginRight")=="0px")?"auto":$(this).css("marginRight"))); 
        $(this).parents(".mejs-container").css("marginBottom", $(this).css("marginBottom")); 
        $(this).parents(".mejs-container").css("marginLeft", (($(this).css("marginLeft")=="0px")?"auto":$(this).css("marginLeft"))); 
        $(this).css("marginTop", "auto"); 
        $(this).css("marginRight", "auto"); 
        $(this).css("marginBottom", "auto"); 
        $(this).css("marginLeft", "auto"); } 
    ); 
});

Answer 2

好吧，媒体元素播放器的渲染方式有很多变化。对于 video/youtube 类型，它实际上变成了 iframe。

但是我能够通过查看开发人员工具中的检查器来确定 id。对我来说，id 是'mep_0'。所以，我能够添加：

#mep_0
{
    margin: 0 auto;
}

不优雅，但它有效。