iFrames in Tabs werden auf mobilen Endgeräten nicht dargestellt

[taktell81]

Hi,

wenn ich mehrere Tabs mit Iframes fülle, dann werden diese in der Desktop Anscht normal dargestellt - allerdings nicht auf mobilen Endgeräten. Dort sieht man maximal den Inhalt des ersten Tabs, aber keine Inhalte mehr in allen folgenden Tabs. Da in den Tabs standartmässig Textinhalte vorgesehen sind nutze ich Tiny um den iframe HTML Code einzufügen.

Ich weiß nicht ob Tiny, die Tabs oder eventuell die Iframes des Buchungssystems (Edoobox) dafür verantwortlich auf mobilen Geräten Probleme zu bereiten. Hat jemand evtl ähnliche Erfahrungen gemacht und kann mir hier weiterhelfen?

Ps: Ich habe auch Akkordions getestet und da wird mobil überhaupt kein iFrame dargestellt.

Besten Gruß
Bjarne

[mlweb]

Link zur Seite?

[taktell81]

https://www.emdr.de/emdr-seminar-teil-1-buchen

[lbableck]

Das Script edoobox.iframe.embedded.v2.2.5.js setzt die Breite für die iframes anhand der Breite des Parent Elements.
Da die Tabs zu dem Zeitpunkt noch display: none; haben ist die Breite des Parents 0 und somit auch die Breite des iframes.

[taktell81]

Super Hinweis,

es wundert mich aber, dass die Interpretation von Desktop und mobil unterschiedlich ist.
Wäre Deine Empfehlung das Script jedem iFrame anzuhängen, damit die Breite jedesmal neu bestimmt wird, sobald ein Tab / Akkordion geladen wird?

LG Bja

[lbableck]

Ich würde den Teil wenn es geht rausnehmen und die Breite der iframes per CSS einfach auf 100% setzen, läuft sich auf das selbe hinaus.

[taktell81]

Leider wird das Script vom Server des Buchungssystems geladen und ist daher für mich nicht editierbar. Die iFrames beinhalteten bereits die 100% Breitenangabe - allerdings ohen gewünschten Effekt.
Aufgrund Deiner Analyse habe ich aber den Einbindungscode des Scripts (anstatt über das Seitenlayout) jedem Iframe angehängt. Alle Inhalte werden nun auch auf mobilen Geräten wieder dargestellt!

Vielen Dank für die Hilfe