HTML - Como hacer que un video cambie al refrescar la página

 
Vista:

Como hacer que un video cambie al refrescar la página

Publicado por Mauro (4 intervenciones) el 22/10/2021 21:36:13
Hola, necesito un código para que un video cambie al refrescar la página. Tengo un código para imágenes y me funciona bien, pero al intentar hacerlo con videos no he podido. Las imágenes y videos los quiero para un Landing page (de fondo).
Saludos y gracias!!
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de ScriptShow
Val: 359
Bronce
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

Como hacer que un video cambie al refrescar la página

Publicado por ScriptShow (409 intervenciones) el 26/10/2021 00:57:02
Saludos Mauro,

a ver algo sencillo para probar...

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>random video</title>
</head>
<body>
<video controls autoplay width="640" height="360">
<source id="vsrc" type="video/mp4">
Please update your browser.
</video>
<script>
document.getElementById("vsrc").src = Math.floor((Math.random()*3)+1) + ".mp4";
</script>
</body>
</html>

Espero sea útil.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Como hacer que un video cambie al refrescar la página

Publicado por Mauro (4 intervenciones) el 26/10/2021 01:19:57
Gracias, Scriptshow,
Pero en ese código ¿cómo llamo los videos para se vayan cargando al refrescar?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Como hacer que un video cambie al refrescar la página

Publicado por Mauro (4 intervenciones) el 26/10/2021 17:59:49
¿podrías darme un ejemplo de donde debo poner los videos en el script por favor?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de ScriptShow
Val: 359
Bronce
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

Como hacer que un video cambie al refrescar la página

Publicado por ScriptShow (409 intervenciones) el 27/10/2021 00:40:28
Saludos Mauro,

una variante con nombres para los vídeos y algo de CSS para ponerlo como fondo, etc...

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<!DOCTYPE html>
<html>
<head>
<title>Random BG Video</title>
<meta name="viewport" content="width=device-width">
<style>
*{
margin:0;
box-sizing:border-box;
}
#video {
top:0;
left: 0;
right: 0;
bottom:0;
position:fixed;
min-width:100%;
min-height:100%;
}
</style>
</head>
<body>
<video autoplay muted loop id="video">
<source src="" type="video/mp4" id="vsrc">
Tu navegador no soporta HTML5 Vídeo.
</video>
<script>
var videos=["video1.mp4","video2.mp4","video3.mp4","video4.mp4"];
document.getElementById("video").src=videos[Math.floor(Math.random()*4)+1];
</script>
</body>
</html>

Espero sea útil.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de ScriptShow
Val: 359
Bronce
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

Como hacer que un video cambie al refrescar la página

Publicado por ScriptShow (409 intervenciones) el 26/10/2021 20:16:25
Disculpa por no haberlo aclarado mejor. Los vídeos serían: 1.mp4 , 2.mp4 , 3.mp4

Es un ejemplo simplificado, que genera números aleatorios hasta 3, ampliable indefinido cambiando (*3) .
No obstante, se puede incluir un Array con nombres, si fuese necesario.

Espero sea útil.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Como hacer que un video cambie al refrescar la página

Publicado por Mauro (4 intervenciones) el 26/10/2021 21:05:06
Muchas gracias!!!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar