iFrame auf Smartphone-Display

    Hallo,
    ich möchte diese Seite:
    http://www.buienradar.nl/image?fn=buien…pe=forecastzozw
    per iFrame in meine WP-Seite einbinden.
    Das stellt kein Problem dar.
    Das Theme ALIZEE ist ein Responsive Theme und so soll der Inhalt auch auf Smartphone Displays dargestellt werden.
    Klappt soweit auch gut, nur das iFrame ist in der Breite abgeschnitten.
    Nun hab ich allerhand probiert, mit div-Containern und css, mit iframely (dieses Plugin erzeugt ein Video auf dem Smartphone, der Inhalt aktualisiert sich aber nicht)...
    Mit meinem Latein bin ich am Ende.
    Hat jemand einen Lösungsansatz für mich?

    Danke erstmal.
    Axel

    • Gerade eben
    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

    Bootstrap wird unterstützt.
    Die Anwendung dieses Codes bewirkt, dass das iFrame am Smartphone weiterhin mit etwa 50% Breite und am PC-Bildschirm in etwa 150x150 Px mit Scrollbalken angezeigt wird.

    Zitat von baumeister65

    Hat jemand einen Lösungsansatz für mich?

    Ich gehe davon aus, dass man ein iFrame grundsätzlich responsive machen kann, indem man die Breite auf 100% (des umgebenden Containers) stellt und die Höhe auf Null. Dann ein padding-bottom, dass dem Seitenverhältnis in Prozent entspricht.

    Das ist die Anleitung, die mindestens 1001-fach für die responsive Einbindung von google Maps im Netz ist. (Das ist dein Suchstichwort für eine genauere Anleitung …)

    Gruß
    helix

    Mit Googlemaps und YouTube-Videos funktioniert die Container-Lösung mittels CSS wunderbar.
    Es geht um das oben angeführte iFrame. Das wird bei den 1001 erwähnten Methoden immer mit voller Höhe (wunderbar), aber eingeschränkter Breite auf Smartphone-Displays dargestellt.

    iFrames machen meiner Erfahrung nach wenig Sinn da die Nachteile beim Einsatz überwiegen. Besonders auf kleinen mobilen Geräten.

    Aus Gründen der Benutzerfreundlichkeit würde ich persönlich eher empfehlen das iFrame über media queries auf kleinen Auflösungen zu verstecken
    und als Platzhalter einen kleinen Screenshot samt Link auf das entsprechende iFrame einzufügen.

    Das hat den weiteren Vorteil das ein Benutzer mit seinem Smartphone keine zwei Seiten von seinem kostbarem Downloadvolumen verschwenden muss.

    Und drittens bedeutet das auch einen großen Vorteil bezüglich Performance. Und das ist auf mobilen Geräten meist ein Problem.

    Es liegt bei dir, aber ich finde die Vorteile einer iFrame losen Mobil-Seite überwiegen deutlich.

    Gruß

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!

Benutzerkonto erstellen Anmelden