fancyBox 탐색 영역이 미디어 컨트롤을 차단하지 못하게 할 수 있습니까?

Question

저는 Vimeo 비디오를 표시하고 탐색하기 위해 fancyBox 2.1.5 및 포함 된 미디어 도우미를 사용하고 있습니다.

다음과 이전 클릭 가능 영역이 하단의 비디오 제어기를 가리지 않는다는 점을 제외하면 모든 것이 잘 작동합니다. 다음 영역이 강조 표시된 그림이 있습니다. 당신이 볼 수 있듯이

, 당신은 볼륨을 조절 전체 화면으로 전환, 또는이 지역 아래에 진행 막대를 조작 할 수 없습니다.

탐색 화살표는 프레젠테이션 영역 외부에 배치 할 수 있지만 모바일 장치의 디스플레이 영역이 줄어들 기 때문에 잘 모르겠습니다.

동영상을 표시 할 때 이러한 클릭 가능 영역이 맨 아래로 확장되는 것을 방지 할 수 있습니까? 아니면 내가 고려하지 않은 다른 해결책일까요?

Answer 1

솔루션을 찾았습니다! jquery.fancybox.css의 탐색 블록이 top 오프셋과 height 매개 변수를 포함하고 있습니다!

top: 0을 설정하고 height: 90%을 설정하면 프레임 아래쪽에 10 %의 간격이 생겨 비디오 컨트롤과 상호 작용할 수 있습니다! 여기에 내가 내 웹 사이트의 CSS에 추가 된 전체 블록의 : 백분율, 그것은 당신이 짧은, 매우 넓은 영상이있는 경우, 90 %의 범위가 여전히 비디오 컨트롤에 먹을 가능성이 있다는

/* Prevent navigation from occluding play controls for videos */ 
.fancybox-type-iframe .fancybox-nav { 
    height: 90%; 
} 

는, 그러나 이것은 지금까지 가지고 720p와 같은 표준 비디오 크기에서 잘 작동합니다.