3

媒体元素 2.12.0

这只发生在 FF 和 Chrome(而不是 IE 或 Opera)中。在导航到具有媒体元素播放器的站点内容后,甚至到媒体元素首页http://mediaelementjs.com/都有一个播放器。

当浏览器缩放设置为正常(通常按 Ctrl+0)时,它看起来没问题。

当缩放增加时(通过按 Ctrl++ 或 Ctrl+ 滚动鼠标滚轮),音量控制将放置在整个元素下方。

MEJS网站截图

上面的屏幕截图是在比正常放大一级的情况下进行的。

有没有办法让它在所有浏览器缩放中看起来都很好?

4

4 回答 4

5

似乎div.mejs-controls的子级在缩放页面时溢出,但这不是 CSS 案例。div.mejs-time-rail的大小由 Javascript 动态生成。(https://github.com/johndyer/mediaelement/blob/master/src/js/mep-player.js#L845

检查元素

我找到了一个可以简单解决问题的技巧,就是将 div.mejs-time-rail 的宽度减小 1px。

所以在这里我得到了一个快速修复。在 mep-player.js 的第 845 行(https://github.com/johndyer/mediaelement/blob/master/src/js/mep-player.js#L845),修改如下

total.width(railWidth - (total.outerWidth(true) - total.width()));

total.width(railWidth - (total.outerWidth(true) - total.width()) - 1);
于 2013-07-11T01:56:49.263 回答
1

我通过更改以下行将其修复在文件 mediaelement-and-player.js 中

line 2705 insert **- 40**
// fit the rail into the remaining space
railWidth = t.controls.width() - usedWidth - 40 - (rail.outerWidth(true) - rail.width());

line 2713 change to
total.width(railWidth - (total.outerWidth(true) - total.width()) - 5);

希望这可以帮助。

于 2013-07-26T08:20:44.340 回答
0

I've faced the same issue. It seems that ChiChou's answer was finally used. If you update mediaElement at least to the version of the 31/08/2014 (2.15.1). You should be fine! https://github.com/johndyer/mediaelement/issues/483

于 2014-12-05T09:09:50.037 回答
0

你必须改变你的CSS并设置宽度

<div id="mep_0" class="mejs-container svg mejs-audio" style="width: 440px; height: 30px;">
<div class="mejs-inner" style="width:100%;">
<div class="mejs-mediaelement">

并检查。希望这会帮助你。

于 2013-07-17T11:38:04.253 回答