html5 - How to display a 5secend video before page load in html? -


i have simple html5 landing page , want show 5secend video before main page. popup or want display video without borders,playback buttons etc. , load main page.

greetings! tried

<script>   function opencolorbox(){     $.colorbox({iframe:true, width:"80%", height:"80%", href: "http://as2.asset.aparat.com/aparat-video/325cc0361862066dc06e8fb1fc7ec8a77684093-240p__39060.mp4"});   }     settimeout(opencolorbox, -5000);   $.colorbox({ overlayclose: true });   </script> 

a simple page loads video in bootstrap modal window. hope gives start!

<!doctype html>     <html lang="en">      <head>         <title>page title</title>         <meta charset="utf-8">         <meta name="viewport" content="width=device-width, initial-scale=1">         <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">         <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>         <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>         <style>         .modal-backdrop {             background-color: #ccc;         }          .modal-backdrop.in {             opacity: 0.2;         }         </style>     </head>      <body>         <div class="container">             <h1 style="text-align:center;">hello</h1>         </div>         <!-- modal -->         <div class="modal fade" id="mymodal" role="dialog">             <div class="modal-dialog modal-md">                 <center><video id="myvideo" src="http://as2.asset.aparat.com/aparat-video/325cc0361862066dc06e8fb1fc7ec8a77684093-240p__39060.mp4" autoplay style="border-radius:5px;width:100%;"></video></center>             </div>         </div>     </body>      </html>     <script>     $("#mymodal").modal()     $(".container").hide();     document.getelementbyid('myvideo').addeventlistener('ended', closemodal, false);      function closemodal() {         $(".container").show();         $('#mymodal').modal('hide');     }     </script> 

Comments

Popular posts from this blog

networking - Vagrant-provisioned VirtualBox VM is not reachable from Ubuntu host -

c# - ASP.NET Core - There is already an object named 'AspNetRoles' in the database -

ruby on rails - ArgumentError: Missing host to link to! Please provide the :host parameter, set default_url_options[:host], or set :only_path to true -