Video responsive einbinden

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)

 

also bei mir funktioniert das leider nicht. Nicht mal das Bild wird angezeigt........

 

<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?

 

auf dem Server, so wie im Pfad angegeben ist:
images/video/MyVideo.mp4

 

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 denn für eine Shopversion? Habe Malibu und da wird bei mir nix angezeigt:

 

hilft auch nicht

 

alles gut, funzt

 

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.)

 

komisch oder? ist ja der selbe, nun ja das Ergebnis zählt.

 

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>