Zur Navigation

Mehrere iframes per Knopfdruck laden

1 Lena567

Hallo Leute,


Zuerst einmal wünsche ich euch allen ein gutes und schönes Jahr 2023!
Möge es uns allen nur Gutes bringen.


Ich möchte per Knopfdruck mehrere iframes laden.
Genauer gesagt sollen YouTube-Videos geladen werden.
Und aufgrund der Datenschutz-Grundverordnung eben erst nach dem Anklicken einer Schaltfläche.

Hierzu habe ich das folgende Skript gefunden:
https://codepen.io/creotip/pen/BaogwB

Wie muss denn das folgende Skript abgeändert werden, damit mehrere YouTube-Videos nach Knopfdruck geladen werden?
$(function(){
    $('#button').click(function(){ 
        if(!$('#iframe').length) {
                $('#iframeHolder').html('<iframe id="iframe" src="https://www.youtube-nocookie.com/embed/dV86B7bXaGo" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" width="560" height="315"></iframe>');
        }
    });   
});

Vielen lieben Dank schon mal für eure Hilfe!

02.01.2023 13:24

2 Jörg

Am einfachsten so:

$(function() {
    $('#button').click(function() {
        if (! $('#iframe1').length) {
            $('#iframeHolder1').html('<iframe id="iframe1" ...></iframe>');
        }
        if (! $('#iframe2').length) {
            $('#iframeHolder2').html('<iframe id="iframe2" ...></iframe>');
        }
    });
});

02.01.2023 14:25

1 Forenmitglied fand diesen Beitrag gut

4 Jörg

Du benötigst für jedes Video einen Container mit der jeweils gleichen ID wie im JavaScript-Code:

<div id="iframeHolder1"></div>
<div id="iframeHolder2"></div>
<!-- etc. -->

02.01.2023 16:36

1 Forenmitglied fand diesen Beitrag gut

5 Lena567

Vielen Dank für deine erneute Hilfe Jörg!
Darauf hätte ich eigentlich selbst kommen müssen, bin ich aber leider nicht.

03.01.2023 09:27

6 Lena567

Dank deiner Hilfe lieber Jörg habe ich habe ich das ganze nun wie gewünscht umsetzen können.

Habe jetzt noch ein paar Ergänzungen vorgenommen.
Die Schaltfläche verschwindet, wenn man darauf geklickt hat und die ganze Seite ist responsive.

http://lena91567.bplaced.net/load-iframe-on-click/

03.01.2023 11:39

Beitrag schreiben (als Gast)

Die Antwort wird nach der Überprüfung durch einen Moderator freigeschaltet.





[BBCode-Hilfe]