Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨

[Ingo 2]

Hallo zusammen,

ich versuche mich seit einigen Tagen daran, eine Wetter-Website in ein Iframe zu integrieren und in einem bestimmten Bereich herein zu zoomen, sodass mir nicht alles angezeigt wird. Leider bekomme ich bis auf ein "Scale" keine Verschiebung, weder mit "left" noch mit "top".
Kann mir jemand weiterhelfen?

#my-iframe{
transform: scale(2);
width: 100%;
height: 100%;
top: 200;
left: 200;
}

Viele Grüße
Ingo

[bahnuhr]

@ingo-2

hab ich auch hier aus dem forum:

<div id="my-div">
<iframe src="http://www.iobroker.net" id="my-iframe" scrolling="no"></iframe>
</div>

<style>
#my-div
{
    width    : 400px;
    height   : 600px;
    overflow : hidden;
    position : relative;
}

#my-iframe
{
    position : absolute;
    top      : -700px;
    left     : -850px;
    width    : 1280px;
    height   : 1200px;
}
</style>

----------------------------------------------------------------------------------

Intenetseite passgenau in widget abbilden

Den Code einfach ins html Widget kopieren.

Erklärung: In der html wird ein DIV angelegt welches über ein iFrame eine Webseite anzeigt (hier Beispiel iobroker.net, 
dort wird jetzt nur noch der Anfang der Adapterliste angezeigt).
Über my-div kannst du die Größe des anzuzeigenden Ausschnitts definieren.
Über my-iframe kannst du dann via top und left das Offset angeben um zu definieren, an welcher Stelle das iFrame "beginnt"
den Inhalt anzuzeigen. An den ganzen Parametern musst du dann rumspielen.

[Ingo 2]

Hi,

vielen Dank für den Tipp. Probiere es morgen Mal aus, wobei ich das meiste so schon ausprobiert hatte.

Viele Grüße
Ingo

[theint]

@ingo-2 Alternativ kannst du es auch etwas kompakter versuchen. Verwende in VIS das basic html widget und füge folgenden Code bei HTML ein: ```

        <iframe src="WEBSEITE" height="1000" width="1000" style="border:none;overflow:hidden;position:absolute;left:20px;top:-330px;transform: scale(1.5);">
        </iframe>

Bei Width und Height legst du den Ausschnitt fest und mit left und top positionierst du die Sicht. Mit Scale setzt du den Zoomfaktor.

[JoergH]

@theint Kann ich eigentlich auch die Farben noch tauschen, wenn ich eine Webseite so anzeigen lasse?