Skip to content Skip to sidebar Skip to footer
Home / Css / Html5 Video

Playing A Video Inside An Image

Post a Comment
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><metacharset="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_containervideo {
    position: absolute;
    top: 30px; 
    left: 40px; 
    z-index: 5;
}
</style></head><body><divid="tv_container"><videowidth="245"height="240"controls><sourcesrc="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"