top of page
Presse: Blog2
  • Writer's pictureLeeroy Berger

COPTR Web in die eigene Homepage einbetten (iFrame)

Updated: Aug 15, 2023

Implementierung des COPTR Web mit Hilfe des ‚scaled iframe wrapper‘ in die eigene Homepage. Einfach den Code kopieren, den Text demo (letzte Codezeile) durch die eigene Web5 Domain ersetzen und in der gewünschten Homepage einbetten. Details zur Implementierung von iFrame's erhalten Sie von Ihrem Webentwickler oder im Hilfebereich Ihrer Homepageverwaltung.


CODE:

<style>
#wrapper { width: 237px; height: 390px; padding: 0; overflow: hidden; }
#scaled-frame { width: 395px; height: 650px; border: 0px; }
#scaled-frame {
zoom: 1;
-moz-transform: scale(0.6);
-moz-transform-origin: 0 0;
-o-transform: scale(0.6);
-o-transform-origin: 0 0;
-webkit-transform: scale(0.6);
-webkit-transform-origin: 0 0;
}
 
@media screen and (-webkit-min-device-pixel-ratio:0) {
#scaled-frame  { zoom: 1;  }
}
</style>

<div id="wrapper"><iframe id="scaled-frame" src="https://demo.coptrweb.de/"></iframe></div>


Beschreibung des ‚scaled iframe wrapper‘ style:

Nimm iFrame Quelle mit Größe X, skaliere auf 60% und packe es in den Rahmen Y.

beschreibt den finalen Rahmen bzw. die Größe des iFrame auf der eigenen Homepage (Y)


#scaled-frame

Ausgangsgröße des COPTR Web (X)


-moz-transform: scale(0.6);

Skalierfaktor für Firefox anpassen (in dieser Einstellung 0.6 = 60%)


-o-transform: scale(0.6);

Skalierfaktor für Opera anpassen (in dieser Einstellung 0.6 = 60%)


-webkit-transform: scale(0.6);

Skalierfaktor für Chrome/Safari etc. anpassen (in dieser Einstellung 0.6 = 60%)



Vorschau iFrame Wrapper (Demo):



bottom of page