Einzelnen Beitrag anzeigen
  #1 (permalink)  
Alt 30.11.2021, 22:08
Dachlatte Dachlatte ist offline
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 23.10.2021
Beiträge: 24
Dachlatte befindet sich auf einem aufstrebenden Ast
Standard Video je nach Auflösung anzeigen, und mit autoplay abspielen

Hallo,
um z.B. ein Video auf dem Desktop hochauflösend und auf dem Smartphone mit etwas niedriger Auflösung anzeigen zu lassen hatte ich diesen Code auf meiner Seite eingebaut:
Code:
<video autoplay muted loop id="myVideo">
          <source src="media/DJI_0029_1280.mp4" type="video/mp4">
</video>
<video autoplay muted loop id="myVideoMobile">
          <source src="media/DJI_0029_640.mp4" type="video/mp4">
</video>
..und mit CSS nur das eine oder das andere Video eingeblendet. Macht aber so keinen Sinn da ja beide dennoch geladen werden.

Jetzt hatte ich im Web diesen Code gefunden, etwas angepasst und dann eingebaut:
Code:
// HTML: 
<div id="media"></div>

// JS: 
var med=document.getElementById("media");
var bild='false';
var video='false';
function start(){
   var bre=window.innerWidth;
   var hoch=window.innerHeight;
   if(bre>=600 && bild=='false'){
        med.innerHTML ='';
        console.log('video läd')
        videos();
        bild='true';
        video='false';
   }
   if(bre<=599 && video=='false'){
        med.innerHTML ='';
        console.log('bild läd')
        bild='false';
        video='true';
        bilds();
   }
   function videos(){ 
       ele=document.createElement('video');
       ele.src='media/DJI_0029_1280.mp4&amp;autoplay=0&amp;mute=1&amp;loop=1';
       // ele.src='media/DJI_0029_1280.mp4';
       med.append(ele) 
   }
   function bilds(){
       ele=document.createElement('video'); //  oder img
       // ele.src='media/DJI_0029_640.mp4&autoplay=1&muted=1&loop=1';
       ele.src='media/DJI_0029_640.mp4';
       med.append(ele) 
  }
}

window.addEventListener('resize',function(){
      start();
})

start();
Das Video wird zwar angezeigt mit z.B. src = "media/DJI_0029_640.mp4", aber wenn ich irgendwelche Parameter anhänge wie das oben beispielhaft zu sehen ist, dann wird das Video nicht mehr gefunden.

Wie könnte ich es denn anstellen dass das Video gleich nach dem Laden in einer Endlosschleife abgespielt wird?

Asoo... ob ich hier in diesem Teil des Forums richtig bin weiß ich leider auch nicht genau. Bitte verschiebt das ggf.
Mit Zitat antworten
Sponsored Links