Hallo,
hoffe der Titel passt so.
Worum gehts?
auf unserer Seite haben wir ein paar Werbepartner, die gern ein paar Werbebanner laufen lassen möchten.
Für diese Zweck habe ich ein kleines php Bannerrotationsskript erarbeitet.
Ok, eher eine Kombi aus mehreren kleinen.
1 html gibt
1. ein Uploadtool für das Hochladen der Bilder
2. eine Textarea für das bearbeiten einer quotefile.txt
3. eine "Gallerieansicht der hochgeladenen Bilder
Die quotefile dient zur Rotation der hinterlegten Banner.
Kurze Rede garkein Sinn, es funktioniert einfach.
Jetzt zum "Problem"
Wir haben dadurch 3 verschiedene php Datein für 3 unterschiedliche Bannergrößen (728px, 468px und 234px)
Diese werden per iframe im entsprechenden Bereich angezeigt.
Durch die vermehrte Nutzung von mobilegeräten ist uns aufgefallen, dass die iframes bei geringer maxwidth abgeschnitten werden.
Gibt es eine möglichkeit den iframe so zu definieren, dass je nach maximaler Breite des Browserfensters der entsprechende Inhalt angezeigt wird?
Seite: https://pbhub.de (468er Banner)
Forum: https://pbhub.de/forum/ (728er Banner)
Habe schon etwas rumprobiert, es aber irgendwie nicht hinbekommen.
Jemand eine Idee?
Danke
Iframe src Wechsel für responsiv [gelöst]
Iframe src Wechsel für responsiv [gelöst]
Zuletzt geändert von TITO0815 am 10.12.2021 23:52, insgesamt 1-mal geändert.
- Cowboy of Bottrop
- Mitglied
- Beiträge: 320
- Registriert: 01.02.2017 21:11
- Wohnort: Bottrop anne Emscher
- Kontaktdaten:
Re: Iframe src Wechsel für responsiv
Ich verwende diese Ext, um Werbebanner zu verwalten:
https://www.phpbb.com/customise/db/extension/ads
Vielleicht hilft dir das weiter.
https://www.phpbb.com/customise/db/extension/ads
Vielleicht hilft dir das weiter.
Keep it County,
Markus aka Cowboy
Markus aka Cowboy
Re: Iframe src Wechsel für responsiv
Hallo.
Danke für die Antwort. Die ext hatte ich auch. War mir aber nix. Und auch dort leider keine automatische Anpassung der Bannergröße.
Mit Bildern so schaffe ich es. Also egal ob via <style> @screen max wider usw. Oder als <Source Image = max width.
Aber mit dem Wechsel der iframequelle will es nicht klappen.
Danke für die Antwort. Die ext hatte ich auch. War mir aber nix. Und auch dort leider keine automatische Anpassung der Bannergröße.
Mit Bildern so schaffe ich es. Also egal ob via <style> @screen max wider usw. Oder als <Source Image = max width.
Aber mit dem Wechsel der iframequelle will es nicht klappen.
- Cowboy of Bottrop
- Mitglied
- Beiträge: 320
- Registriert: 01.02.2017 21:11
- Wohnort: Bottrop anne Emscher
- Kontaktdaten:
Re: Iframe src Wechsel für responsiv
Und wenn du die Bilder direkt einbindest, nicht als iFrame? Dann könntest du doch statt des Frames einen
div
benutzen und den bzw. das Bild in diesem Container im CSS referenzieren.Keep it County,
Markus aka Cowboy
Markus aka Cowboy
Re: Iframe src Wechsel für responsiv
Dann hab ich aber leider keine rotation der Banner inkl dazugehöriger Links. Bzw ja könnte man. Dann jede Woche den Code ändern. Bzw die php umschreiben.
- Cowboy of Bottrop
- Mitglied
- Beiträge: 320
- Registriert: 01.02.2017 21:11
- Wohnort: Bottrop anne Emscher
- Kontaktdaten:
Re: Iframe src Wechsel für responsiv
OK. Mit einem iFrame geht es jedenfalls nicht, dass deine Banner responsive sind. Du kannst zwar die Größe des Frames vorgeben, der darin gezeigte Inhalt stammt von einer anderen Seite, die auch das Aussehen und die Größe bestimmt.
Zudem, wenn du Inhalte einer Seite einbinden willst, die möglicherweise ein Framebreaker-Script einsetzt, hast du eh ein Problem.
Zudem, wenn du Inhalte einer Seite einbinden willst, die möglicherweise ein Framebreaker-Script einsetzt, hast du eh ein Problem.
Keep it County,
Markus aka Cowboy
Markus aka Cowboy
Re: Iframe src Wechsel für responsiv
Habs gelöst was im Grunde recht simpel war.
Zwar nicht wirklich "schick" als Lösung, aber funktionell.
Zwar nicht wirklich "schick" als Lösung, aber funktionell.
Code: Alles auswählen
<html>
<head>
<style>
.werbung_234 {
align: center;
}
.werbung_468 {
align: center;
}
.werbung_728 {
align: center;
}
@media only screen and (max-width: 520px) {
.werbung_234 {
}
.werbung_468 {
display: none;
}
.werbung_728 {
display: none;
}
}
@media only screen and (min-width: 521px) and (max-width: 820px) {
.werbung_234 {
display: none;
}
.werbung_468 {
}
.werbung_728 {
display: none;
}
}
@media only screen and (min-width: 821px) {
.werbung_234 {
display: none;
}
.werbung_468 {
display: none;
}
.werbung_728 {
}
}
</style>
</head>
<div class="werbung_728">
<iframe align="center" src="/meinordner728/banner.php" width="100%" height="110" name="Sponsor Banner"></iframe>
</div>
<div class="werbung_468">
<iframe align="center" src="/meinordner468/banner.php" width="100%" height="80" name="Sponsor Banner"></iframe>
</div>
<div class="werbung_234">
<iframe align="center" src="/meinordner234/banner.php" width="100%" height="110" name="Sponsor Banner"></iframe>
</div>
</html>