Video player is one of the best thing in any website by which we can easily play any video in our website. Here is what I made
Here is a bit different type of video player i made while i was in college ..i was inspired from television so i planned to make one video player which will look like TV by including logo and banner news .
HERE is the CODE
///please add your won video source to play
<html>
<head>
//css part
<style>
.video{
width:100%;
height:640px;
background-color:black;
}
.videocont{
position: relative;
}
.videocont:before{
content: "";
width: 120px;
height: 100px;
position: absolute;
background: url(logosite.png);
//please add your logo here
background-size: cover;
opacity: 30.5;
padding: 1px;
right: 108px;
top: auto;
}
#news{
z-index: 100;
position: absolute;
top: 612px;
left: 0;
background-color: blue;
color: white;
line-height: 0px;
}
.videocont1:before {
content: "";
width: 100%;
height: 36px;
position: absolute;
background: url(news.png);
//please add background img while video not playing
background-size: cover;
opacity: 30.5;
padding: 1px;
right: 1596px;
top: 726px;
z-index: 110;
}
</style>
</head>
<body bgcolor="silver ">
<center>
<div class="videocont1">
<div class="videocont">
<marquee id="news"><h3><strong>
your text goes here like news
</strong></h3></marquee>
<video class="video" autoplay controls poster="banner.jpg" titles="DJSB">
<source src="pollution.mp4" type="video/mp4">-->
<!--<iframe width="100%" height="800" src="https://www.youtube.com/embed/BD_jXprtJ2I" frameborder="0" allowfullscreen></iframe>-->
</video>
</div>
</div>
</center>
</body>
</html>OUTPUT
Its free to use but Please dont forget to give me credit..It means alot
Nice