Wie kann man das Modal nach einigen Sekunden verschwinden lassen?

Question

Ich benutze Iframe innerhalb Modal und ich verstecke div mit Modal nach ein paar Sekunden, aber der eigentliche Bildschirm nicht zu konzentrieren, ist es immer noch ausgeblendet. Bitte überprüfen Sie die folgenden Bilder für mehr Klarheit. noch eine Frage, gibt es eine Möglichkeit, die Playerleiste zu ändern, die ich unter dem Video zum Abspielen und Pausieren bekomme. Es ist wirklich langweilig.

Diese Hauptseite, die im Fokus stehen soll, wie andere normale Seiten aber immer noch verblasst.

starken Text

Code ist hier,

<div class="logo" id="div3"> 
     <div class="embed-responsive embed-responsive-16by9"> 
      <div id="myModal" class="modal fade"> 
       <div class="modal-dialog"> 
        <div class="modal-content"> 
         <div class="modal-body"> 
          <iframe id="Video" width="900" height="500" src="C:\Users\deeptim\Downloads\picture_shop_logo.mp4" allowfullscreen ALLOWTRANSPARENCY="true"></iframe> 
         </div> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 

und Funktionen sind

 $(document).ready(function() { 
      setTimeout(function() { 
       $("div#logo_text").fadeOut("slow", function() { 
       $("div#logo_text").hide(); 
       $("div#logo_img").show(); 
       $("div#div3").hide(); 
       $("div#myCarousel").show(); 
       }); 
      }, 5000); 
     }); 

    setTimeout(function() { 
     $('#div3').fadeOut('fast'); 
    }, 5000); 

    $(document).ready(function() { 
     var url = $("#Video").attr('src'); 

     $("#myModal").on('hide.bs.modal', function() { 
      $("#Video").attr('src', ''); 
     }); 

     $("#myModal").on('show.bs.modal', function() { 
      $("#Video").attr('src', url); 
     }); 

     $("#myModal").modal(); //Display modal on load 

    }); 

Gibt es eine Möglichkeit obige Anforderung zu erreichen?

Answer 1

Verwenden Sie $("#myModal").modal("hide") zu tatsächlich hide die modale lieber als einzelne Komponenten getrennt zu verbergen. Auch ich verstehe nicht, warum Sie zwei timeouts mit genau gleicher Verzögerung haben. Probieren Sie Folgendes.

 $(document).ready(function() { 
      setTimeout(function() { 
       $("div#logo_text").fadeOut("slow", function() { 

       $("div#logo_img").show(); 

       //Hide modal window 
       ////////////////////////////////////// 
       $("#myModal").modal("hide"); 
       ////////////////////////////////////// 

       $("div#myCarousel").show(); 
       }); 
      }, 5000); 
     }); 

    $(document).ready(function() { 
     var url = $("#Video").attr('src'); 

     $("#myModal").on('hide.bs.modal', function() { 
      $("#Video").attr('src', ''); 
     }); 

     $("#myModal").on('show.bs.modal', function() { 
      $("#Video").attr('src', url); 
     }); 

     $("#myModal").modal("show"); //Display modal on load 

    });