1
我想隱藏包裝在容器中的HTML5視頻的溢出。但是Firefox和Chrome仍然有滾動條。當我嘗試在Jsfiddle中重新創建問題時,它工作正常(沒有滾動條),但firefox或chrome中的相同代碼創建滾動並且不隱藏任何溢出。溢出:隱藏的HTML5視頻
任何想法如何讓HTML5視頻的溢出隱藏,以及爲什麼它不起作用? PS。我曾試圖改變容器各種事物的位置,並嘗試打破overflow: hidden
到overflow-x
和overflow-y
<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>
CSS
.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%;
}
}
謝謝,但不幸的是,這並沒有解決我的問題。在Chrome和Firefox中,當我更改窗口大小/寬度時,滾動仍處於啓用狀態。 – auto
我剛剛在我的OS X(Mac)上測試了Chrome和FF,它不會給我任何滾動條..你是Windows/Linux嗎? – Evgeny
啊,我刪除了位置:絕對從容器中,它似乎工作正常!謝謝! – auto