Guten Abend, Leider haben die Codes hier im forum nicht zum Erfolg geführt. Ich würde gerne produktvideos responsive einfügen, auch auf dem PC. Es handelt sich um lokal gespeicherte Videos. Bitte um tatkräftige Unterstützung.
Also der Code funktioniert bei mir: HTML: <div class="embed-responsive embed-responsive-16by9"> <video title="Titel" alt="Titel" autoplay="" loop="" poster="images/video/no-video-index.jpg"><source src="images/video/MyVideo.mp4" type="video/mp4"></video> </div> poster: ist ein gleich großes Bild, sollte ein Browser das Video nicht anzeigen (dürfen)
<div class="embed-responsive embed-responsive-16by9"> <iframe class="embed-responsive-item" src="--->video in ausrufezeichen<---"></iframe> </div> Meinst du Lokal gespeichert bei dir aufm Computer? oder hast es schon irgendwo auf nem "Server" liegen?
Kann sein das bei dir etwas fehlt: im StyleEdit in deinem Style im eigenen CSS Code folgendes hinzufügen: @import "../bootstrap/bootstrap/responsive-embed"
Ja dann so: <div class="embed-responsive embed-responsive-16by9"> <iframe class="embed-responsive-item" src="images/video/MyVideo.mp4"></iframe> </div> Funktioniert bei mir ohne Probleme
Was hast du nun gemacht das es geht? Ich habe Honeygrid, evtl. lag es ja daran, was ich aber nicht glaub. Klär uns auf
habe nur den Code von Gerd genommen: <div class="embed-responsive embed-responsive-16by9"> <iframe class="embed-responsive-item" src="images/videos/video.mp4"></iframe> </div> Beispiel: (Link nur für registrierte Nutzer sichtbar.)
Hallo Zusammen, haben auch den Quellcode eingesetzt. Im Firefox und Chrome funktioniert es problemlos. Leider funktioniert es nicht auf mobilen Endgeräten. Getestet mit Iphone und Android. Würde mich über eine Rückmeldung freuen.
<div class="embed-responsive embed-responsive-16by9 "> <iframe allowfullscreen="embed-responsive-item" src="(Link nur für registrierte Nutzer sichtbar.) Pfad"></iframe> </div> funktioniert bei mir überall, ist aber ohne ohne cookie consens tool
<meta name="viewport" content="width=device-width, initial-scale=1"> <style type="text/css"> .container { position: relative; width: 100%; overflow: hidden; padding-top: 56.25%; /* 16:9 Aspect Ratio */ } .responsive-iframe { position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%; border: none; } </style> </p> <div class="container"> <iframe class="responsive-iframe" src="......"></iframe> </div> funktioniert bei mir immer. egal ob desktop oder mobil.
Das hier haben wir bei uns laufen, das läuft. Das Poster ist das start-Foto, und bei source src muss das Video angegeben werden, in dem Fall ist es im mp4-Format. <video class="img-responsive" controls="" height="505" poster="images/Foto.jpg" width="760"><source src="video1" type="video/mp4" /> Your browser does not support the video tag.</video> Code: <video class="img-responsive" controls="" height="505" poster="images/Poster.jpg" width="760"><source src="images/mein_video" type="video/mp4" /> Your browser does not support the video tag.</video>
dem div um den Videocode die Klasse "video-container" geben. Beispiel für ein YT Video: <div class="video-container"> <iframe width="100%" height="100%" src="" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> </div>