2012-12-18 3 views
4

MediaElement 파일을 원본 디렉토리에 모두 업로드했지만 데모에서는 비디오와 오디오는 잘 재생되지만 재생, 볼륨 및 전체 화면 버튼은 보이지 않습니다. 제어 막대.컨트롤 막대에 아무 버튼도 없습니다. - mediaelement.js

어떤 아이디어가 잘못 되었나요?

감사

매트

+0

이 문제가 발생한 사람이 있습니까? 재생, 볼륨 및 전체 화면 버튼은 여전히 ​​작동하지만 표시 할 수있는 아이콘이 없습니다. 데모 및 독립형 설치와 동일합니다. –

답변

9

나는 또한 같은 문제에 달렸다. 서버의 SVG 이미지에 올바른 MIME 유형을 추가했는지 확인하십시오. 그들이 없거나 잘못 구성된 경우 브라우저에 표시되지 않습니다.

나는 htaccess로를 통해이 문제를 처리 :

AddType image/svg+xml svg 
AddType image/svg+xml svgz 

여전히 표시하기 위해 SVG 이미지를 얻을 수없는 경우, 당신은 항상 컨트롤의 .PNG 버전을 사용하는 CSS의 배경 이미지를 변경할 수 있습니다 막대 및 재생 아이콘.

+2

감사합니다 ** spncr ** 답변을 위해 시간을내어 주셔서 감사합니다. 대단히 감사합니다. 그것은 SVG 이미지를 위해 추가되지 않는 MIME 유형에 달려 있습니다. CSS의 PNG 버전으로 변경했습니다. –

2

이 문제가 있었는데, 기본적으로 파일을 옮기고 CSS가 컨트롤 이미지 파일의 잘못된 위치를 찾고 있었기 때문입니다. mediaelementplayer.css

.mejs-controls .mejs-button button { 
background: transparent url(controls.png) no-repeat; 
} 

확인에

확실히 배경의 URL은 controls.png 파일의 실제 위치와 일치합니다.

+0

고마워 ** 데이비드 ** 답변 시간을내어 주셔서 감사합니다. 대단히 감사합니다. 그것은 MIME 형식이 SVG 이미지 용 서버에 추가되지 않았기 때문에 CSS의 PNG 버전으로 변경했습니다. –

6

spncr에서 첫 번째 답변을 읽은 후 SVG 대신 PNG 파일을 사용하는 MEjs 스타일 시트에서 no-svg 클래스를 발견했습니다. 나는 오디오 요소를 그 클래스를 사용하는 DIV로 감쌌다.

<div class="no-svg"> 
    <audio id="player1" controls> 
    <source src="file.mp3" type="audio/mp3" > 
    <p>This browser doesn't support audio.</p> 
    </audio> 
</div> 
+0

그레이트 찾으십시오! 마임 유형을 추가하는 것은 나에게 효과가 없었습니다 ... 이것은 생명의 은인이었습니다. – Justin

0

Windows 서버에서 .htaccess 파일 대신 사용되는 web.config 파일의 코드입니다.

<configuration> 
    <system.webServer> 
     <staticContent> 
     <mimeMap fileExtension=".svg" mimeType="image/svg+xml" /> 
     <mimeMap fileExtension=".svgz" mimeType="image/svg+xml" /> 
     </staticContent> 
    </system.webServer> 
</configuration> 
관련 문제