Изменить цвет медиаэлементов.js игрока

Question

Как изменить цвет проигрывателя mediaelements.js? Это черное, но мне нужно сменить его на синий ...

Идеально я хотел бы, чтобы черный фон был прозрачным и просто показывал индикатор выполнения.

Answer 1

Вам нужно всего лишь изменить несколько строк в файле CSS с именем mediaelementplayer.css расположен в src/css:

Сначала найдите строку .mejs-container { и закомментируйте background-color свойство, как так:

/*background: #000;*/ 

Далее, найти линия .mejs-container .mejs-controls { должна быть равна 150. Затем удалите все фоновые свойства, следующие:

background: url(background.png); 
background: rgba(0, 0, 0, 0.7); 
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(50,50,50,0.7)), to(rgba(0,0,0,0.7))); 
background: -webkit-linear-gradient(top, rgba(50,50,50,0.7), rgba(0,0,0,0.7)); 
background: -moz-linear-gradient(top, rgba(50,50,50,0.7), rgba(0,0,0,0.7)); 
background: -o-linear-gradient(top, rgba(50,50,50,0.7), rgba(0,0,0,0.7)); 
background: -ms-linear-gradient(top, rgba(50,50,50,0.7), rgba(0,0,0,0.7)); 
background: linear-gradient(rgba(50,50,50,0.7), rgba(0,0,0,0.7)); 

Заменить их на следующей строке:

background: transparent; 

Сделайте ваш использовать правильный файл CSS, где были изменены атрибуты.

Answer 2

Мое решение - обязательно вставьте этот стиль ПОСЛЕ стиля по умолчанию для элемента мультимедиа. Он будет перезаписывать фоновое изображение, которое было ранее установлено, с цветом для фона панели управления:

.mejs-container .mejs-controls { 
     background: red; 
    }