Youtube Video über HTML-Objekt responsive einbinden mit NoCookie-Parameter - Geht das?

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • Youtube Video über HTML-Objekt responsive einbinden mit NoCookie-Parameter - Geht das?

    Hallo zusammen, bin neu hier und hoffe, dass mir vielleicht jemand helfen kann.

    Ich möchte ein YouTube Video responsive und mit NoCookie-Parameter in meine Webseite einbinden. Dabei möchte ich keine Scrollbalken, keine großen Lücken, keine schwarzen Bereiche oder dass das Video abgeschnitten wird. Geht das überhaupt? Ich dachte ich mache das über ein HTML-Object.

    Ich habe verschiedene Methoden probiert: dieraumvermesser.de/videotest.html

    OBEN: Hier habe ich eine Lösung probiert (über CSS), die ich im Internet gefunden habe. Leider ist die Größe des HTML-Objekts in WebSite X5 selber aber "absolut" auf eine Pixelzahl beschränkt, so dass das Video bei manchen Auflösungen wieder abgeschnitten wird oder bei mobiler Auflösung riesige Lücken entstehen. Kann man das HTML-Object irgendwie auf Höhe=100% umschalten?

    UNTEN: Hier habe ich es so gemacht (ohne CSS) wie es mir in diesem Beitrag gesagt wurde: helpcenter.websitex5.com/de/post/188234. Das sieht aber auch nicht gut aus.

    Warum ich das nicht mit einem Video/Audio-Objekt mache?
    Weil ich dann wieder das YouTube-Cookie-Problem habe, welches ich umgehen möchte.
    Ist aber derzeit genauso gelöst: https://www.dieraumvermesser.de.

    Kann mir jemand weiterhelfen?
    Ist das vielleicht in Version 15 leichter lösbar?

    Liebe Grüße
    Sandra
    Dateien
  • Hi Sandra !

    Versuche mal diesen Code !

    HTML-Quellcode

    1. <div class="resp-container">
    2. <iframe class="resp-iframe" src="https://www.youtube-nocookie.com/embed/W1KvBGAjlRg?rel=0" gesture="media" allow="encrypted-media" allowfullscreen></iframe>
    3. </div>


    CSS-Quellcode

    1. .resp-container {
    2. position: relative;
    3. overflow: hidden;
    4. padding-top: 56.25%;
    5. }
    6. .resp-iframe {
    7. position: absolute;
    8. top: 0;
    9. left: 0;
    10. width: 100%;
    11. height: 100%;
    12. border: 0;
    13. }
    Alles anzeigen
    Wissen ist MACHT ! Nichts zu Wissen macht nichts !
    Wissen ist MACHT ...ohne es zu wissen !