2014-01-08 2 views
0

내 전체 화면 버튼을 클릭하면 동영상이 원본 크기로 늘어나지 만 전체 화면에는 표시되지 않습니다. 그러나 나는 두 개 이상의 측면에서 검은 색 막대를 원하지 않는다. 그것을 설명 할 수있는 CSS 속성이 없습니다. 비디오 속성을 width: 100%;height: 100%;으로 설정하거나 자동으로 설정하면 도움이되지 않습니다. 전체 화면은 Firefox에서는 완벽하게 작동하지만 Chrome에서는 완벽하게 작동하지 않습니다. 이 코드를 사용하여 전체 화면 모드로 전환합니다.Chrome에서 전체 화면 모드가 작동하지 않습니다.

$('.fullscreen-btn').click(function() { 
      if (movie[0].requestFullscreen) { 
       movie[0].requestFullscreen(); 
      } else if (movie[0].mozRequestFullScreen) { 
       movie[0].mozRequestFullScreen();    

      } else if (movie[0].webkitRequestFullscreen) { 
       movie[0].webkitRequestFullscreen(); 
      } 
      ... 
}); 

그 문제를 해결하는 방법을 알고있는 사람이 있습니까?

+0

가 당신을 도울 정말 작은 코드가있어 어떤 jFiddle있어이 질문의 답변에 감사? 페이지의 HTML? –

+0

Thx와 죄송합니다. 그렇게 할 수 없습니다. 기본 컨트롤을 사용할 수 있으면 작동하는지 알았습니다. 하지만 내 자신의 컨트롤을 사용하고 싶습니다. 전체 화면 버튼 (비디오 크기에 맞게 조정), 작은 화면 버튼 (플레이어 크기에 맞게 조정) 및 전체 화면 버튼을 다시 클릭하면 전체 화면으로 조정됩니다. 이상합니다. 그러나 더 많은 문제가있는 것 같습니다. 때때로 비디오를 닫은 후 Chrome이 중단됩니다. – user2718671

답변

3

해결책을 찾았습니다! 문제는 Chrome의 기본 html5 동영상 컨트롤과 내 맞춤 컨트롤 사이의 충돌입니다. hide video controls in fullscreen mode 내가 발견 문제가 CSS 규칙을 사용하여 해결되었는지 : ...

video::-webkit-media-controls { 
    display:none !important; 
} 
+0

안드로이드 크롬에서 자바 스크립트를 통해 html5 플레이어 전체 화면을 만들 수 있는지 알고 싶습니까? 나는 그것을 테스트하고 아이폰에서 작동하지만 안드로이드 크롬에서 작동하지 않습니다! 왜 그런지 알고 있습니까? – user1788736

+0

안녕하세요! 나는 "더빙 된 모드"(안드로이드 4.4 이후)가 큰 마법의 단어라고 생각한다. 그러나 나는 그것에 대한 어떤 경험도 없다. 그러나 당신이 google 할 때 당신이 무엇인가 발견 할 것이다 고 생각한다;) – user2718671

+0

작동하지 않는다. another @ user2718671 – Sharvan

관련 문제