播放器下方的mediaelement音频播放器音量滑块[关闭]答案

【问题标题】：mediaelement audio player volume slider below player [closed]播放器下方的mediaelement音频播放器音量滑块[关闭]
【发布时间】：2013-05-07 22:34:37
【问题描述】：

我正在尝试将我的主题转换为 WordPress 3.6 版中的新 mediaelement 音频播放器。

css 在响应模式下中断，并且音量滑动条显示在播放器的外部和下方。当您更改屏幕尺寸时，音量滑块会反复弹出到位和离开位置，这表明插件内存在计算和返回的宽度问题。

【问题讨论】：

你说 css 坏了……给我们看看 css！

标签： wordpress audio mediaelement.js

【解决方案1】：

我是 jQuery 的新手，但这似乎是解决办法...

替换：b = this.controls.width() - a - (c.outerWidth(true) - c.width())

与：b = this.controls.width() - a - (c.outerWidth(true) - c.width())-1

这样做总是强制 .mejs-time-rail 宽度比计算值小 1 px，因此 css 永远不会损坏。

【讨论】：

我必须减去 3 才能让它工作，我实际上使用了 5，以防万一。

【解决方案2】：

一个不优雅的 CSS 修复是通过将它添加到子主题的 style.css 来使容器更宽一些

.mejs-container {
width: 101% !important;

}

WordPress 升级时不会被覆盖

【讨论】：

【解决方案3】：

我通过添加新样式表来覆盖它的默认显示方式来做到这一点。

// Hides any ugly overflow
.wp-audio-shortcode {
     overflow: hidden;
}

// Give ample room to the controls
.wp-audio-shortcode .mejs-controls {
    width: 101% !important;
}

这比覆盖任何 wordpress 核心文件更好地解决了它。

【讨论】：