播放的圖像

我的問題裏面的視頻與此有關this question 播放的圖像

<div id="tv_container"> 
<video width="300" height="240" controls> 
<source src="Spin1038.mov" type="video/mov"> 
Your browser does not support the video tag. 
</video> 
</div> 

#tv_container { 
    width: 360px; 
    height: 800px; 
    position: relative; 
} 
#tv_container:after { 
    content: ''; 
    display: block; 
    background: url('http://mediacentral.ie/snapchat/wp-content/uploads/2016/02/Cell.jpg') no-repeat top left transparent; 
    width: 100%; 
    height: 100%; 
    left: 0px; 
    top: 0px; 
    position: absolute; 
    z-index: 10; 
} 
#tv_container video { 
    position: absolute; 
    top: 30px; 
    left: 40px; 
    z-index: 5; 
}

我做同樣的事情。它不工作，即使我刪除圖像，即使那樣，視頻也無法正常工作。

This is my page.

來源

2016-02-18 Nauman Tanwir

您的網頁無法訪問。 – zer00ne

請現在嘗試。謝謝。 –

請在您的問題中發佈完整的問題描述，而不僅僅是指向其他類似問題的鏈接。如果這個問題被刪除，那麼你的問題將失去一切意義。 – j08691

變化#tv_container:after { z-index: -10 }

也改變了<video width='245'....>

<!doctype html> 
 
<html> 
 
<head> 
 
<meta charset="utf-8"> 
 
<title></title> 
 
<style> 
 
#tv_container { 
 
    width: 360px; 
 
    height: 800px; 
 
    position: relative; 
 
} 
 
#tv_container:after { 
 
    content: ''; 
 
    display: block; 
 
    background: url('http://mediacentral.ie/snapchat/wp-content/uploads/2016/02/Cell.jpg') no-repeat top left transparent; 
 
    width: 100%; 
 
    height: 100%; 
 
    left: 0px; 
 
    top: 0px; 
 
    position: absolute; 
 
    z-index: -10;  /* This should be lowest z-index value */ 
 
} 
 
#tv_container video { 
 
    position: absolute; 
 
    top: 30px; 
 
    left: 40px; 
 
    z-index: 5; 
 
} 
 
</style> 
 
</head> 
 

 
<body> 
 
<div id="tv_container"> 
 
<video width="245" height="240" controls> 
 
<source src="https://glpjt.s3.amazonaws.com/so/av/vs12s3.mp4" type="video/mp4"></video> 
 
</div> 
 

 

 
</body> 
 
</html>

來源

2016-02-18 14:22:18 zer00ne

非常感謝你。有效。 –

非常歡迎:-) – zer00ne

雖然我在自動播放時在自己的網頁上設置了視頻。所以，他們都在同一時間開始玩。有沒有辦法，只有當我滾動到頁面的那一部分時纔會玩。這是我的網頁（http://mediacentral.ie/slogged/） –

回答

相關問題