Skip to main content
se eliminaron 8 caracteres en el cuerpo
Origen Enlace
Vick Muñoz
  • 2.9k
  • 1
  • 10
  • 19

Espero te funcione :)

<!-- Modal -->
<head>
<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>
</head>

<div class="modal fade" id="myModal" role="dialog">
<a data-controls-modal="myModal" data-backdrop="static" data-keyboard="false" href="#"> <!-- Coloque esta etiqueta y sirve para que no pueda cerrar el modal aprimiendo fuera de éste, así que tiene que apretar el close o el tache -->
    <div class="modal-dialog">
        <!-- Modal content-->
        
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">×</button>
                <h4 class="modal-title">Modal with Dynamic Content</h4>
            </div>
            <div class="modal-body">
              <video autoplay id="video">
    <source src="https://www.w3schools.com/tags/movie.mp4" type="video/mp4">
</video>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

<script>

$(document).ready(function() {


//$('#video').get(0).play();
      $('#myModal').modal({show:true});
 
      });

     $('button').click(function(){ //agrego la funcion click a las etiquetas "button" para que al cerrar el modal pongan pausa al video, como vez utilice la etiqueta <video> y con el id del div utilizo la función pause();
        
        $('#video').get(0).pause();
      });
});
</script>

Espero te funcione :)

<!-- Modal -->
<head>
<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>
</head>

<div class="modal fade" id="myModal" role="dialog">
<a data-controls-modal="myModal" data-backdrop="static" data-keyboard="false" href="#"> <!-- Coloque esta etiqueta y sirve para que no pueda cerrar el modal aprimiendo fuera de éste, así que tiene que apretar el close o el tache -->
    <div class="modal-dialog">
        <!-- Modal content-->
        
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">×</button>
                <h4 class="modal-title">Modal with Dynamic Content</h4>
            </div>
            <div class="modal-body">
              <video autoplay id="video">
    <source src="https://www.w3schools.com/tags/movie.mp4" type="video/mp4">
</video>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

<script>

$(document).ready(function() {


$('#video').get(0).play();
      $('#myModal').modal({show:true});
 
      
     $('button').click(function(){ //agrego la funcion click a las etiquetas "button" para que al cerrar el modal pongan pausa al video, como vez utilice la etiqueta <video> y con el id del div utilizo la función pause();
        
        $('#video').get(0).pause();
      });
});
</script>

Espero te funcione :)

<!-- Modal -->
<head>
<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>
</head>

<div class="modal fade" id="myModal" role="dialog">
<a data-controls-modal="myModal" data-backdrop="static" data-keyboard="false" href="#"> <!-- Coloque esta etiqueta y sirve para que no pueda cerrar el modal aprimiendo fuera de éste, así que tiene que apretar el close o el tache -->
    <div class="modal-dialog">
        <!-- Modal content-->
        
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">×</button>
                <h4 class="modal-title">Modal with Dynamic Content</h4>
            </div>
            <div class="modal-body">
              <video autoplay id="video">
    <source src="https://www.w3schools.com/tags/movie.mp4" type="video/mp4">
</video>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

<script>

$(document).ready(function() {


//$('#video').get(0).play();
      $('#myModal').modal({show:true});
 
});

     $('button').click(function(){ //agrego la funcion click a las etiquetas "button" para que al cerrar el modal pongan pausa al video, como vez utilice la etiqueta <video> y con el id del div utilizo la función pause();
        
        $('#video').get(0).pause();
      });
</script>

Origen Enlace
Vick Muñoz
  • 2.9k
  • 1
  • 10
  • 19

Espero te funcione :)

<!-- Modal -->
<head>
<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>
</head>

<div class="modal fade" id="myModal" role="dialog">
<a data-controls-modal="myModal" data-backdrop="static" data-keyboard="false" href="#"> <!-- Coloque esta etiqueta y sirve para que no pueda cerrar el modal aprimiendo fuera de éste, así que tiene que apretar el close o el tache -->
    <div class="modal-dialog">
        <!-- Modal content-->
        
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">×</button>
                <h4 class="modal-title">Modal with Dynamic Content</h4>
            </div>
            <div class="modal-body">
              <video autoplay id="video">
    <source src="https://www.w3schools.com/tags/movie.mp4" type="video/mp4">
</video>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

<script>

$(document).ready(function() {


$('#video').get(0).play();
      $('#myModal').modal({show:true});
 
      
     $('button').click(function(){ //agrego la funcion click a las etiquetas "button" para que al cerrar el modal pongan pausa al video, como vez utilice la etiqueta <video> y con el id del div utilizo la función pause();
        
        $('#video').get(0).pause();
      });
});
</script>