Externe Inhalte responsive einbetten.

on Dienstag, 29 Januar 2013. Posted in Allgemeines Web

Ich habe einen externen Inhalt, wie ein Video oder ein Script und möchte diesen responsive einbetten.

Externe Inhalte responsive einbetten.

Externe Inhalte wie Videos, Scripte,

Webseiten usw. responsive einbetten?

Hier bist du richtig. Klick miich an!!!

Externe Inhalte wie Videos, Scripte, Webseiten usw. responsive einbetten?

 

Kein Problem. Wieder einmal fangen wir im CSS Bereich an und fügen folgendes ein:


.amensic-embed-container {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 Verhältnis */
    padding-top: 30px; /* IE6 workaround*/
    height: 0;
    overflow: hidden;
}

.amensic-embed-container iframe,
.amensic-embed-container object,
.amensic-embed-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

 

So je nachdem was Ihr einbetten wollt, nehmt ihr die Klasse raus. Wir möchten zbsp. unser hauseigenes Prospekt einbetten.

 

Deshalb folgende Klasse:


<div class="amensic-embed-container">
    <iframe width="1280" height="720" src="http://deinewebseite.de/jegllichenInhalt.html" frameborder="0" allowfullscreen></iframe>
</div>

 

Zack haben wir unser Prospekt responsive eingebettet. Zu finden unter dem Menüpunkt Online Prospekt.


Wir hoffen wir konnten helfen. Euer Amensic Marketing Team

Kommentare (0)

Bitte Kommentar schreiben

Sie kommentieren als Gast.