How to create an online TV channel Use simple HTML CSS and JavaScript code


 

<script>
function myFunction1() {
    document.getElementById("myFrame").src = "https://www.youtube.com/embed/live_stream?channel=UCYqujAD5831EywH1jldBu5w&autoplay=1;";
}  //1
function myFunction2() {
    document.getElementById("myFrame").src = "https://www.youtube.com/embed/live_stream?channel=UCKlhfq1ILoAFav7iw5iCnfA&autoplay=1;";
}  //2
function myFunction3() {
    document.getElementById("myFrame").src = "https://www.youtube.com/embed/live_stream?channel=UCXuHIkEezOy_b1pnkN0-TIg&autoplay=1;";
}  //3 
function myFunction4() {
    document.getElementById("myFrame").src = "https://www.youtube.com/embed/live_stream?channel=UCHLqIOMPk20w-6cFgkA90jw&autoplay=1;";
}  //4
function myFunction5() {
    document.getElementById("myFrame").src = "https://www.youtube.com/embed/live_stream?channel=UC0ThmWmb7WQATrrDMLQph7Q&autoplay=1;";
}  //5
function myFunction6() {
    document.getElementById("myFrame").src = "https://www.youtube.com/embed/live_stream?channel=UCN6sm8iHiPd0cnoUardDAnw&autoplay=1;";
}  //6
function myFunction7() {
    document.getElementById("myFrame").src = "https://www.youtube.com/embed/live_stream?channel=UCxHoBXkY88Tb8z1Ssj6CWsQ&autoplay=1;";
}  //7
function myFunction8() {
    document.getElementById("myFrame").src = "https://www.youtube.com/embed/live_stream?channel=UCUvXoiDEKI8VZJrr58g4VAw&autoplay=1;";
}  //8
function myFunction9() {
    document.getElementById("myFrame").src = "https://www.youtube.com/embed/live_stream?channel=UCFrVnrQF6kTrkDdFZoT9CTQ&autoplay=1;";
}  //9
function myFunction10() {
    document.getElementById("myFrame").src = "https://www.youtube.com/embed/live_stream?channel=UCraPI8sg-eiNzUrurxhKeEQ&autoplay=1;";
}  //10
function myFunction11() {
    document.getElementById("myFrame").src = "https://www.youtube.com/embed/live_stream?channel=UCPREnbhKQP-hsVfsfKP-mCw&autoplay=1;";
}  //11
</script>
<!--++++++++++++++++-->
<style>
    .tvLogoAria{
        width:100%;
        height:65px;
        overflow-y: auto;
        background-color:#C1BFBF;
        border-style: dotted;
        border-color:black;
    }
.tv_box{
    display: inline-block;
    cursor: pointer;
    pointer-events:none;
}
.tv_logo{
    width:105px;
    height:60px;
    background-color:#8C8787;
    padding:3px;
}

.tv_logo_img{
    width:100%;
    height:50px;
}
@media screen and (max-width: 680px) {
    .tv_box {
        height:300px;
        pointer-events:auto;
    }
</style>
<!--++++++++++++++++-->
<div class="tvLogoAria"><!---------------------------->
<marquee behavior="alternate" direction="left" onmouseover="this.stop();"
           onmouseout="this.start();">
<button class="tv_logo" onclick="myFunction1()"><img src="TV_LOGO/ntv.jpg" class="tv_logo_img"></button>
<button class="tv_logo" onclick="myFunction2()"><img src="TV_LOGO/atn.jpg" class="tv_logo_img"></button>
<button class="tv_logo" onclick="myFunction3()"><img src="TV_LOGO/gtv.jpg" class="tv_logo_img"></button>
<button class="tv_logo" onclick="myFunction4()"><img src="TV_LOGO/channel24.jpg" class="tv_logo_img"></button>
<button class="tv_logo" onclick="myFunction5()"><img src="TV_LOGO/ekattor.jpg"  class="tv_logo_img"></button>
<button class="tv_logo" onclick="myFunction6()"><img src="TV_LOGO/jamuna.jpg" class="tv_logo_img"></button>
<button class="tv_logo" onclick="myFunction7()"><img src="TV_LOGO/somoy.jpg" class="tv_logo_img"></button>
<button class="tv_logo" onclick="myFunction8()"><img src="TV_LOGO/dbc.jpg" class="tv_logo_img"></button>
<button class="tv_logo" onclick="myFunction9()"><img src="TV_LOGO/naimat.jpg" class="tv_logo_img"></button>
<button class="tv_logo" onclick="myFunction10()"><img src="TV_LOGO/alQuran.jpg" class="tv_logo_img"></button>
<button class="tv_logo" onclick="myFunction11()"><img src="TV_LOGO/news24.jpg" class="tv_logo_img"></button>

<!-- https://www.helpmatebd.com/wp-content/uploads/2021/04/ --> <!-- Repless Logo Link -->

</marquee>
</div><!---------------------------->
<iframe allowfullscreen="" class="tv_box" height="500" id="myFrame" src="https://www.youtube.com/embed/live_stream?channel=UCxHoBXkY88Tb8z1Ssj6CWsQ&autoplay=1&controls=1;" width="100%"></iframe>

إرسال تعليق

0 تعليقات
* Please Don't Spam Here. All the Comments are Reviewed by Admin.