Skip to content Skip to sidebar Skip to footer

Playing A Video Inside An Image

my question is related to this this question

Solution 1:

Change #tv_container:after { z-index: -10 }

Also changed the <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>

Post a Comment for "Playing A Video Inside An Image"