Ankündigung

Einklappen
Keine Ankündigung bisher.

Einbinden von 360 Grad Panoramas & iframe 3D Grundriss. Welche Methode ist responsiv?

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Einbinden von 360 Grad Panoramas & iframe 3D Grundriss. Welche Methode ist responsiv?

    Möchte 360 Grad Panorama einbinden, Link . Hab das mit "Opt privacy iframe" probiert, muss dem aber eine fixe Breite und Höhe zuweisen. Damit ist der Rundgang auf Tablets und Telefonen nicht responiv und damit leider nicht brauchbar.

    Selbes Verhalten mit 3D Grundriss. Einbindung via "embed code"
    ( <iframe src="https://3d.magicplan.app/#embed/?key=MzE5NzgxMjg2ODc2MmM3NDkzYTQxNGJlZmZlYzZkM2M0N GMxMDMwNDM1M2QwYTI1MDcwNGY5NTQ4NjFjZDdkNSDGH7G6TmC 2AHelrmyeB5GE%2FQcPZvYTkZ6kbOhgohfkCStYwo%2BvSPNqd PkoywaILw%3D%3D" width="1175px" height="600px" allowfullscreen="true" style="border: 0;"></iframe> )

    In dem Fall ist zwar keine fixe Breite vorgegeben, aber ist trotzdem nicht responsive.

    Wie kann man die Elemente korrekt einbinden?

    Herzlichen Dank für Hilfe und Unterstützung!

  • #2
    Hi Cris,

    es ist mir keine saubere iFrame responsive Lösung bekannt, da der iFrame immer eine Höhe braucht. Mit dem CSS "width: 100%" lässt sich der iFrame auf die maximale Browserbreite fahren, aber in der Höhe funktioniert das leider nicht. Es gibt ein paar Workarounds z.B. für YouTube iFrames wo man die Höhe aus dem Seitenverhältnis der Videos nimmt:
    https://www.w3schools.com/howto/howt...ve_iframes.asp

    *********************
    Neu: Kostenloser Contao Installer 3.0
    *********************
    Contao und Erweiterungen in wenigen Sekunden laden, installieren und updaten - ohne Composer oder Contao Manager.

    Kommentar


    • #3
      Danke, schau ich mir an!

      Kommentar


      • #4
        GELÖST
        • hab unter Contao Einstellungen <script> und <iframe> erlaubt
        • Inhaltselement iframe auswählen
        • CSS: allowfullscreen="true" style="border: 0; min-height:600px; width:100%;

        Kommentar

        Lädt...
        X