오버플로 : HTML5 비디오에 대해 숨김

Question

컨테이너에 래핑 된 HTML5 비디오의 오버플로를 숨기려고합니다. 그러나 여전히 파이어 폭스와 크롬에는 스크롤 바가 있습니다. Jsfiddle에서 문제를 다시 만들려고하면 괜찮습니까 (스크롤 막대 없음).하지만 Firefox 나 크롬에서 같은 코드가 스크롤을 만들고 오버플로를 숨기지 않습니다.

숨기기 위해 HTML5 비디오의 오버플로를 어떻게 얻을 수 있는지, 그리고 그것이 작동하지 않는 이유는 무엇입니까? 추신. 나는 여러 가지로 컨테이너의 위치를 ​​변경 시도 및 overflow-x까지와 overflow-yoverflow: hidden을 깨는 시도했다

<div class="video_container"> 
<video autoplay loop controls muted="true"class="video_window"> 
    <source src="http://www.html5videoplayer.net/videos/toystory.mp4" type="video/mp4"> 
Your browser does not support the video tag. 
</video> 
</div> 

당신이 그 성가신 막대를 의미하는 경우 하나의 트릭을 할해야

.video_container{ 
    position: absolute; 
    top: 0; 
    right: 0; 
    bottom: 0; 
    left: 0; 
    z-index: -100; 
    overflow:hidden 

} 

video{ 
     position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 

} 


@media (min-aspect-ratio: 16/9) { 
    video { 
    height: 300%; 
     top: -100%; 
    } 
} 

@media (max-aspect-ratio: 16/9) { 
    video{ 
    width: 300%; 
    left: -100%; 
    } 
} 

Answer 1

CSS DIV의 스크롤 요소. 이것을 래퍼 요소 (예 : .video_container)로 설정하십시오.

&::-webkit-scrollbar { 
    display: none; 
}