Skip to content
  • Home
  • Aktuell
  • Tags
  • 0 Ungelesen 0
  • Kategorien
  • Unreplied
  • Beliebt
  • GitHub
  • Docu
  • Hilfe
Skins
  • Light
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Standard: (Kein Skin)
  • Kein Skin
Einklappen
ioBroker Logo

Community Forum

donate donate
  1. ioBroker Community Home
  2. Deutsch
  3. Visualisierung
  4. Kamerabild responsive in VIS

NEWS

  • Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨
    BluefoxB
    Bluefox
    16
    1
    1.0k

  • Neuer Blogbeitrag: Monatsrückblick - Dezember 2025 🎄
    BluefoxB
    Bluefox
    13
    1
    698

  • Weihnachtsangebot 2025! 🎄
    BluefoxB
    Bluefox
    25
    1
    2.0k

Kamerabild responsive in VIS

Geplant Angeheftet Gesperrt Verschoben Visualisierung
cameravishow-totemplateown project
11 Beiträge 5 Kommentatoren 2.0k Aufrufe 9 Watching
  • Älteste zuerst
  • Neuste zuerst
  • Meiste Stimmen
Antworten
  • In einem neuen Thema antworten
Anmelden zum Antworten
Dieses Thema wurde gelöscht. Nur Nutzer mit entsprechenden Rechten können es sehen.
  • Curtis777C Offline
    Curtis777C Offline
    Curtis777
    schrieb am zuletzt editiert von
    #1

    Liebe Leute,
    Ich suche vergeblich seit 3 Tagen wie ich in meiner VIS ein kleines Iframe einbinden kann,
    Indem der Kamera Stream ohne Scrollbalken erscheint also angepasst an das iframe selbst

    habt ihr das dazugehörige html snippet vielleicht für mich

    sigi234S wendy2702W 2 Antworten Letzte Antwort
    0
    • Curtis777C Curtis777

      Liebe Leute,
      Ich suche vergeblich seit 3 Tagen wie ich in meiner VIS ein kleines Iframe einbinden kann,
      Indem der Kamera Stream ohne Scrollbalken erscheint also angepasst an das iframe selbst

      habt ihr das dazugehörige html snippet vielleicht für mich

      sigi234S Online
      sigi234S Online
      sigi234
      Forum Testing Most Active
      schrieb am zuletzt editiert von
      #2

      @Curtis777

      Welche Cam?

      Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.
      Immer Daten sichern!

      1 Antwort Letzte Antwort
      0
      • Curtis777C Offline
        Curtis777C Offline
        Curtis777
        schrieb am zuletzt editiert von
        #3

        eine billige china cam die ich geschenkt bekommen habe.
        greife das Video als Link im browser so ab.
        http://192.168.0.199/video/livemb.asp
        leider kein richtiges mjpeg

        sigi234S 1 Antwort Letzte Antwort
        0
        • Curtis777C Curtis777

          eine billige china cam die ich geschenkt bekommen habe.
          greife das Video als Link im browser so ab.
          http://192.168.0.199/video/livemb.asp
          leider kein richtiges mjpeg

          sigi234S Online
          sigi234S Online
          sigi234
          Forum Testing Most Active
          schrieb am zuletzt editiert von sigi234
          #4

          @Curtis777 sagte in Kamerabild responsive in VIS:

          eine billige china cam die ich geschenkt bekommen habe.
          greife das Video als Link im browser so ab.
          http://192.168.0.199/video/livemb.asp
          leider kein richtiges mjpeg

          https://www.ispyconnect.com/man.aspx?n=china

          Aha, der Stream kommt ja, also du siehst was?

          Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.
          Immer Daten sichern!

          1 Antwort Letzte Antwort
          0
          • Curtis777C Offline
            Curtis777C Offline
            Curtis777
            schrieb am zuletzt editiert von
            #5

            ja sehe ein iframe aber eben mit scrollbalken weil das video in 1080p ist

            CrunkFXC sigi234S 2 Antworten Letzte Antwort
            0
            • Curtis777C Curtis777

              ja sehe ein iframe aber eben mit scrollbalken weil das video in 1080p ist

              CrunkFXC Offline
              CrunkFXC Offline
              CrunkFX
              Forum Testing
              schrieb am zuletzt editiert von
              #6

              @Curtis777 Probiers mal damit, ist zwar ein Workaround sollte aber gehen:

              <div id="contentframe" style="position:relative; top: -198px; left: -260px;">
                 <iframe width="1024" height="768" scrolling="no" frameBorder="0"  src="http://192.168.0.199/video/livemb.asp " style="-webkit-transform:scale(0.5);-moz-transform-scale(0.5);"></iframe>
              </div>
              
              width="1024" height="768" <!--  Diese Auflösung wird oben um 0.5 im IFrame reduziert  -->
              
              top: -198px; left: -260px <!--  Leider verschiebt sich das Bild je nach Auflösung. Das kannst du hiermit anpassen  -->
              

              Benutzung:

              1. basic-html Widget anlegen
              2. html Copy und Paste
              3. Für den ersten Test die Größe des Widgets auf "width: 508px" und "height: 286" setzen.

              Schau mal ob das bei dir Klappt.

              MFG
              CrunkFX

              Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

              Curtis777C 1 Antwort Letzte Antwort
              3
              • Curtis777C Curtis777

                ja sehe ein iframe aber eben mit scrollbalken weil das video in 1080p ist

                sigi234S Online
                sigi234S Online
                sigi234
                Forum Testing Most Active
                schrieb am zuletzt editiert von sigi234
                #7

                @Curtis777 sagte in Kamerabild responsive in VIS:

                ja sehe ein iframe aber eben mit scrollbalken weil das video in 1080p ist

                Zieh das Widget soweit auseinander bis die Balken verschwinden, oder schau dir mal overflow x/y an

                Screenshot (26)_LI.jpg

                Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.
                Immer Daten sichern!

                1 Antwort Letzte Antwort
                0
                • CrunkFXC CrunkFX

                  @Curtis777 Probiers mal damit, ist zwar ein Workaround sollte aber gehen:

                  <div id="contentframe" style="position:relative; top: -198px; left: -260px;">
                     <iframe width="1024" height="768" scrolling="no" frameBorder="0"  src="http://192.168.0.199/video/livemb.asp " style="-webkit-transform:scale(0.5);-moz-transform-scale(0.5);"></iframe>
                  </div>
                  
                  width="1024" height="768" <!--  Diese Auflösung wird oben um 0.5 im IFrame reduziert  -->
                  
                  top: -198px; left: -260px <!--  Leider verschiebt sich das Bild je nach Auflösung. Das kannst du hiermit anpassen  -->
                  

                  Benutzung:

                  1. basic-html Widget anlegen
                  2. html Copy und Paste
                  3. Für den ersten Test die Größe des Widgets auf "width: 508px" und "height: 286" setzen.

                  Schau mal ob das bei dir Klappt.

                  MFG
                  CrunkFX

                  Curtis777C Offline
                  Curtis777C Offline
                  Curtis777
                  schrieb am zuletzt editiert von
                  #8

                  @CrunkFX Danke das hilft schon sehr.
                  er schneidet leider noch sehr viel ab unten und rechts
                  Da ich das ganze sehr gern im so ca 350px breite betreiben möchte immer noch nicht passend.!

                  Ich versuche die Werte und Texte zu verstehen...
                  was muss ich denn anpassen ?

                  screenshot

                  CrunkFXC 1 Antwort Letzte Antwort
                  0
                  • Curtis777C Curtis777

                    @CrunkFX Danke das hilft schon sehr.
                    er schneidet leider noch sehr viel ab unten und rechts
                    Da ich das ganze sehr gern im so ca 350px breite betreiben möchte immer noch nicht passend.!

                    Ich versuche die Werte und Texte zu verstehen...
                    was muss ich denn anpassen ?

                    screenshot

                    CrunkFXC Offline
                    CrunkFXC Offline
                    CrunkFX
                    Forum Testing
                    schrieb am zuletzt editiert von
                    #9

                    @Curtis777 Da ich leider gerade keine Kamera zum testen in Reichweite hab, musst du das übernehmen.

                    Mit den Werten "0.5" kannst du das Bild weiter verkleinern. z.B. "0.2". Dann fällt dir auf, dass das Bild in die Mitte des html Widgets rutscht.

                    style="-webkit-transform:scale(0.5);-moz-transform-scale(0.5);"
                    

                    Um das auszugleichen passt du die Verschiebung hier an:

                    top: -198px; left: -260px
                    

                    MFG
                    CrunkFX

                    Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

                    1 Antwort Letzte Antwort
                    0
                    • Curtis777C Curtis777

                      Liebe Leute,
                      Ich suche vergeblich seit 3 Tagen wie ich in meiner VIS ein kleines Iframe einbinden kann,
                      Indem der Kamera Stream ohne Scrollbalken erscheint also angepasst an das iframe selbst

                      habt ihr das dazugehörige html snippet vielleicht für mich

                      wendy2702W Offline
                      wendy2702W Offline
                      wendy2702
                      schrieb am zuletzt editiert von
                      #10

                      @Curtis777 Importier mal das Widget und passe die Quelle an:

                      [{"tpl":"tplImage","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"src":"http://192.168.178.54:8085","stretch":true,"name":"Bild Garage Gross"},"style":{"left":"0.86%","top":"6.5%","width":"98.97%","height":"93.5%","border-width":"1px","z-index":"2"},"widgetSet":"basic"}]
                      

                      Bitte keine Fragen per PN, die gehören ins Forum!

                      Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

                      walle79W 1 Antwort Letzte Antwort
                      0
                      • wendy2702W wendy2702

                        @Curtis777 Importier mal das Widget und passe die Quelle an:

                        [{"tpl":"tplImage","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"src":"http://192.168.178.54:8085","stretch":true,"name":"Bild Garage Gross"},"style":{"left":"0.86%","top":"6.5%","width":"98.97%","height":"93.5%","border-width":"1px","z-index":"2"},"widgetSet":"basic"}]
                        

                        walle79W Offline
                        walle79W Offline
                        walle79
                        schrieb am zuletzt editiert von
                        #11

                        @wendy2702 Vielen Dank für den Tipp.:+1:

                        1 Antwort Letzte Antwort
                        0
                        Antworten
                        • In einem neuen Thema antworten
                        Anmelden zum Antworten
                        • Älteste zuerst
                        • Neuste zuerst
                        • Meiste Stimmen


                        Support us

                        ioBroker
                        Community Adapters
                        Donate

                        380

                        Online

                        32.6k

                        Benutzer

                        82.0k

                        Themen

                        1.3m

                        Beiträge
                        Community
                        Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen | Einwilligungseinstellungen
                        ioBroker Community 2014-2025
                        logo
                        • Anmelden

                        • Du hast noch kein Konto? Registrieren

                        • Anmelden oder registrieren, um zu suchen
                        • Erster Beitrag
                          Letzter Beitrag
                        0
                        • Home
                        • Aktuell
                        • Tags
                        • Ungelesen 0
                        • Kategorien
                        • Unreplied
                        • Beliebt
                        • GitHub
                        • Docu
                        • Hilfe