Iframe fitting a live feed

Configuration Frontend
1

I have a real nut to crack,

I am new to this forum because up till now I worked my way around any problems i had,

I am trying to fit a live feed of an Online traffic camera into an iframe and this works really well except it scales horribly almost every link i paste into has white borders or a scroll bar which i want to avoid
the biggest problem is that the original live feed website does not automatically scale the video so now i tried it with cardmod and a really really simple css code which I think works excpet a bit of he frame is cut off but no scroll bars so this is a win for a programming newbie like me now i tried opening it on the mobile app no matter what i do with cardmod i doesn’t change a thing and it display barely half the frame

is there anything i can do to just make it work i want a dashboard with multiple cards so i can get a traffic overview

type: iframe
url: >-
  https://webcams2.asfinag.at/webcamviewer/SingleScreenServlet/?user=webcamstartseite&wcsid=A013_010,950_2_00094255&ssid=b2ddf68f-47c4-4c76-9a18-1ac5413a9abf&token=IyMjIzUxMiM0MTYjYXRERSNpbmZvI2ZhbHNlI05vdFVzZWQjMzYyNzgzOTg4NA
aspect_ratio: 90%
card_mod:
  style: |
    div#root iframe  {
    transform: scale(100%);
    transform-origin: 0 0;
    width: 515px;
    height: 416px;
    justify-self: center;
    margin-left: 0px !important;
          }
2

Why do you not use dots and commas in your writing? It needs to be decrypted.

1 Like
3

I really am a beginner at programming I started to write code with esphome and the yaml dashboard half a year ago so If you could explain further i would be very thankful as this code is just copied off of google search results and chatgpt

4

Being a beginner is not a problem, you are very welcome. I just said that you are not dividing your writing into separate sentences. This makes your writings rather unclear.

5

What Ildar_Gabdullin says: try to write the way you speak because you CANNOT say that sentence the way you wrote it, without any stops to take a breath.

I didn’t even try to understand what you wrote but maybe by telling you, you might improve your writing style so you might get more help.

6

As for your card-mod code - I will try to test it tomorrow when will access to a PC.

7

Oh now I understand,
I did not realise this would be a problem, i tried to explain it simple because I am not a native speaker
I never read out loud its all in the head so i don’t think about stops for breathing,
Thanks for the constructive critisism.

1 Like
8

изображение
изображение1190×517 128 KB 

type: vertical-stack
cards:
  - type: entities
    entities:
      - entity: input_number.test_level_1
        name: scale
  - type: iframe
    url: >-
      https://webcams2.asfinag.at/webcamviewer/SingleScreenServlet/?user=webcamstartseite&wcsid=A013_010,950_2_00094255&ssid=b2ddf68f-47c4-4c76-9a18-1ac5413a9abf&token=IyMjIzUxMiM0MTYjYXRERSNpbmZvI2ZhbHNlI05vdFVzZWQjMzYyNzgzOTg4NA
    aspect_ratio: '515:416'
    card_mod:
      style: |
        div#root iframe  {
          transform: scale({{states("input_number.test_level_1")|float / 100|float}});
          transform-origin: 0 0;
          width: 100000px;
          height: 100000px;
        }