Iframe für mobile iOS oder Android Geräte
gefunden auf: stackoverflow
Dieses Iframe Skript eignet sich zu Verwendung für iOS Systeme wie das iPhone oder iPad. Android Systeme können ja, im Gegensatz zu iOS, auch einen ganz normalen Iframe darstellen.
Das Skript besteht aus zwei Teilen.
Zunächst fügt Ihr die CSS für dieses Iframe in die HTML des Layouts ein, wobei Ihr dort die gewünschte Höhe und Breite des anzuzeigenden Iframes und des Containers eintragt.
> Layout markieren > Fenster “Layout-Eigenschaften” > Button “HTML” > “Zwischen Head Tags” einfügen
<style>
#iframe_survey {
height: 400px; /* Hoehe vom iFrame */
padding-top: 5px; /* Abstand nur auf meiner Seite wegen Schattenrahmen */
}
.scroll-container {
height: 410px; /* etwas hoeher als Hoehe in Class oben */
width: 880px; /* Breite vom Container */
overflow: auto;
-webkit-overflow-scrolling: touch;
}
</style>
Dann zieht Ihr Euch ein Textfeld, an der anzuzeigenden Stelle für das Iframe auf eine Breite auf, die die in der CSS angegebene Breite (hier 880px) vom Container mindestens um die Breite des Scrollbalkens übersteigt (hier 900px) und fügt den Aufruf in den HTML-Code Editor des Textfeldes ein. Tragt die URL zu der geframten Seite ein.
<div class="scroll-container scroll-ios">
<iframe id="iframe_survey" src="http://www.VerlinkeSeite.de" style="border:0px #FFFFFF none;" name="myiFrame" frameborder="0" marginheight="0px" marginwidth="0px" width="100%"></iframe>
</div>
Das Iframe lässt sich nun am iOS Gerät scrollen, indem man mit dem Finger den Inhalt verschiebt.
Viel Spaß!
