Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. VIS basic Widgets iFrame und CSS

    NEWS

    • ioBroker@Smart Living Forum Solingen, 14.06. - Agenda added

    • ioBroker goes Matter ... Matter Adapter in Stable

    • Monatsrückblick - April 2025

    VIS basic Widgets iFrame und CSS

    This topic has been deleted. Only users with topic management privileges can see it.
    • M
      mc-hollin last edited by

      Hallo,

      ich probiere gerade die iFrame Widgets aus.

      Momentan stehe ich aber auf dem Schlauch.

      Ich schaffe es nicht die margin des body innerhalb des iFrames auf 0px zu setzen.

      Dadurch bekomme ich Probleme, wenn ich auf dem iFrame mit border-radius und box-shadow spiele.

      Ich zeige ein Bild(Kamera) im iFrame an, mit der gleichen Größe wie das iFrame.

      Es wird aber immer ein Rand angezeigt und es kommen dadurch auch die Scrollbalken.

      Kann ich eine CSS für innerhalb des iFrames definieren?

      Bild links: Static Image

      Bild rechts: iFrame
      822_iframe..jpg

      1 Reply Last reply Reply Quote 0
      • P
        pix last edited by

        Hallo,

        Eigentlich mit frameborder = 0 oder no und ebenso scrolling = no. Hier steht mehr

        http://www.mediaevent.de/xhtml/iframe.html

        Du kannst das aber im iFrame Widget nicht konfigurieren. Nimm deshalb lieber das basic Html Widget und setze darein den HTML Befehl iFrame.

        Hier noch ein paar Tipps zu iFrame

        http://www.a-coding-project.de/187/iframes/

        Um das mit CSS zu machen nutze overflow.

        http://webdesign.about.com/od/iframes/a … nd-css.htm

        Gruß

        Pix

        Gesendet von meinem iPhone mit Tapatalk

        1 Reply Last reply Reply Quote 0
        • M
          mc-hollin last edited by

          Danke für die schnelle Antwort.

          Es geht mir aber eher darum wie ich das 8fach iFrame Widget nutzen kann.

          Im Prinzip müsste nur im iFrame/body der Style margin:0px gesetzt werden.

          Dann erscheinen auch bei gleicher Größe von iFrame und Bild keine Scrollbalken mehr.

          Nur leider finde ich keine Möglichkeit dies unter VIS dem Widget beizubringen.

          Meine Lösungsvorschlag für das Widget wäre:

          • eine zusätzliche Angabe einer CSS Datei für das HTML Konstrukt im iFrame

          • eventuell eine Checkbox zur Deaktivierung der Scrollbars über das Widget (scrolling="no" und seamless="seamless" )

          @Bluefox: Ich denke dies wäre aber eher eine Erweiterung für dich im Widget selber.

          1 Reply Last reply Reply Quote 0
          • P
            pix last edited by

            Kann es gerade nicht selbst ausprobieren. Aber dem Widget eine CSS Klasse geben (Widgeteinstellungen unter Kommentar) und diese Klasse im CSS Reiter definieren reicht nicht?

            Pix

            Gesendet von meinem iPhone mit Tapatalk

            1 Reply Last reply Reply Quote 0
            • M
              mc-hollin last edited by

              Im iFrame Head Bereich wird eine "resource://gre/res/ImageDocument.css" eingebaut.

              Ich hab aber keine CSS aus dem VIS im iFrame Container zur Verfügung.

              1 Reply Last reply Reply Quote 0
              • Bluefox
                Bluefox last edited by

                @mc-hollin:

                • eine zusätzliche Angabe einer CSS Datei für das HTML Konstrukt im iFrame `
                  Das wird schwer. Kennst du jQuery Selector oder wie ich das machen kann?

                @mc-hollin:

                • eventuell eine Checkbox zur Deaktivierung der Scrollbars über das Widget (scrolling="no" und seamless="seamless" ) `
                  Das kann ich machen.
                1 Reply Last reply Reply Quote 1
                • M
                  mc-hollin last edited by

                  @Bluefox:

                  Das wird schwer. Kennst du jQuery Selector oder wie ich das machen kann? `
                  Leider auch nicht. Ich mach mich mal schlau 😉

                  Ich glaube hier muss man auch zwei unterschiedliche Situationen betrachten:

                  1. Angabe eines Bildes für das iFrame:

                  Hier würde es helfen wenn du im Body den Style="margin:0px" standardmäßig setzen würdest.

                  Du gibst hier ja den HTML Konstukt vor.

                  2. Angabe einer Url für das iFrame

                  Hier kann ja die Source selber für das margin sorgen.

                  Ich nutze das 8fach iFrame um bei ausgeschalteter Kamera ein einfaches Bild anzuzeigen.

                  Hierbei kommt es halt zu Ansichtsproblemen.

                  Hab gerade noch eine Idee!

                  Könnte ich für das einfache Bild nicht eine eigene View erstellen und diese View im iFrame als Url angeben?

                  Dann müsste ich doch auch das Bild mit CSS formatieren können.

                  Bin gerade nicht zu Hause und kann das nicht probieren.

                  UPDATE: Funktioniert auch nicht. Das View im Iframe wird zwar im Editor angezeigt, aber nicht mehr beim Aufruf der Index.html

                  1 Reply Last reply Reply Quote 0
                  • First post
                    Last post

                  Support us

                  ioBroker
                  Community Adapters
                  Donate

                  998
                  Online

                  31.7k
                  Users

                  79.7k
                  Topics

                  1.3m
                  Posts

                  3
                  7
                  3603
                  Loading More Posts
                  • Oldest to Newest
                  • Newest to Oldest
                  • Most Votes
                  Reply
                  • Reply as topic
                  Log in to reply
                  Community
                  Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                  The ioBroker Community 2014-2023
                  logo