¿Cómo precargar el video cuando la página se carga en HTML5?

El atributo HTML <preload> se usa para especificar la forma en que el desarrollador cree que se debe cargar el video cuando se carga la página.

Sintaxis

<video preload=""> </video>

Hay 3 valores para el atributo de precarga automático, metadatos y ninguno.

Nota: una string vacía conduce al valor de atributo automático predeterminado.

Ejemplo 1: El siguiente ejemplo muestra el elemento de video usando ningún valor de atributo para la propiedad de precarga .

HTML

<!DOCTYPE html> 
<html> 
 <body> 
    <center> 
        <h1 style="color:green;">GeeksforGeeks</h1> 
  
        <h3>HTML preload Attribute</h3> 
  
        <video width="400" height="200" controls preload="none"> 
            <source src= 
"https://media.geeksforgeeks.org/wp-content/uploads/20190616234019/Canvas.move_.mp4"
                    type="video/mp4"> 
            <source src= 
"https://media.geeksforgeeks.org/wp-content/uploads/20190616234019/Canvas.move_.ogg"
                    type="video/ogg"> 
        </video> 
    </center> 
</body> 
  
</html> 

Producción:

precarga sin valor

Ejemplo 2: El siguiente ejemplo demuestra el elemento de video usando el valor de atributo automático .

HTML

<!DOCTYPE html> 
<html> 
<body> 
    <center> 
        <h1 style="color:green;">GeeksforGeeks</h1> 
  
        <h3>HTML preload Attribute</h3> 
  
        <video width="400" height="200" controls preload="auto"> 
            <source src= 
"https://media.geeksforgeeks.org/wp-content/uploads/20190616234019/Canvas.move_.mp4"
                    type="video/mp4"> 
            <source src= 
"https://media.geeksforgeeks.org/wp-content/uploads/20190616234019/Canvas.move_.ogg"
                    type="video/ogg"> 
        </video> 
    </center> 
</body> 
  
</html> 

Producción:

precarga con valor automático

Publicación traducida automáticamente

Artículo escrito por aksrathod07 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *