MediaElement.js Internet Explorer 8, показывающий блочные прямоугольники

Question

Я использую плагин WordEditor MediaElement.js для воспроизведения MP3-файлов на моей домашней странице.

Но в Internet Explorer 8 У меня проблемы с плагином.

Вместо кнопки воспроизведения и кнопки регулировки громкости отображается только прямоугольник . Я тестировал на двух разных компьютерах с тем же результатом.

Вы можете проверить его здесь: http://www.alatarmusic.com/noise-reduction/

Он отлично работает с Firefox и Safari на моем iPhone. И я знаю, что другие сайты хорошо отображаются в моем Internet Explorer. Например, игрок на MediaElementJS.com выглядит корректно. Кажется, что-то не так с моей домашней страницей?

Но что может быть причиной этого?

Answer 1

имел тот же вопрос в IE7, а также IE8:

Исправление мне было убедиться, был сброшен стиль фильтра:

filter: none; 

Answer 2

Ваш style-sheet содержит следующие CSS:

.post .content button{background:linear-gradient(top,#ffffff 0%,#e9e9e9 100%);-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='#e9e9e9')"; 

Украшенный:

.post .content button { 
    background: linear-gradient(top,#ffffff 0%,#e9e9e9 100%); 
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='#e9e9e9')"; 
} 

Последнее свойство, -ms-filter, является частным расширением CSS от Microsoft, который только разобрано Internet Explorer.

Цвет #ffffff белый, а цвет #e9e9e9 светло-серый.

Поскольку эффект работает только в Internet Explorer, только пользователи IE будут видеть светлый прямоугольник вместо кнопки воспроизведения.

Установка filter в none возвращает кнопку:

Эта разметка делает, вероятно, эффект другие кнопки в вашем блоге Wordpress, поэтому удаление не может быть вариантом. Вместо этого вы можете добавить filter:none в CSS для .mejs-button; например:

.mejs-button{ 
    filter: none; 
}