Zur Navigation

Werbeanzeige in einer Ebene je nach Bildschirmgröße ausblenden

1 krieger98

Hallo,
Ich suche ein Script PHP oder Java mit dem ich eine Werbeanzeige die in einer Ebene liegt ausschalten je nach Bildschirmgröße.
Die Werbeanzeige wird jetzt bei einer Bildschirmgröße von unter 15 Zoll in die eigentliche Navigation verschoben.
Bei einer Bildschirmgröße von 17 bis 22 Zoll wird alles richtig dargestellt. Es handelt sich um die Seite siehe unten.
Die Werbung links außerhalb des Containers ist damit gemeint (Elektrofahrrad).
Die Ebenen sind abgelegt in der Datei <link href="ebene_tipps2011.css" rel="stylesheet" type="text/css" />.
Mein Gedanke war, eine zweite CSS-Datei zu erstellen die diese Ebene (Werbung) nicht enthält.
Ich habe dieses mit folgenden Java-Script versucht was aber nicht geklappt hat:
<meta content="revealTrans(Duration=1.0,Transition=5)" http-equiv="Site-Enter" />
<link href="body_schrift_tipps2011.css" rel="stylesheet" type="text/css" />
<link href="ebene_tipps2011.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
if (screen.width == 1280) {
document.write('<link rel="stylesheet" type="text/css" href="ebene_tipps2011_test.css">');
}
</script>
Die Ebene wird mit mit folgenden Code aufgerufen:
<div id="werbung">
&nbsp;<a href="http://www.elektrofahrrad-einfach.de/?ref=24564" target="_top" title="Umbausätze und Antriebe für alle Fahrräder">&nbsp;<img alt="Banner-Elktro-Fahrrad" src="grafik/Elktrofahrrad-Werbung125-460.jpg" /></a></div>
Wie kann ich diese Ebene durch eine Abfrage übergehen.
http://www.fahrrad-workshop-sprockhoevel.de/Tipps.htm

29.11.2013 15:08 | geändert: 29.11.2013 15:16

2 Jörg

Für eine solche Lösung braucht es JavaScript, da damit die Bildschirmbreite ausgelesen werden kann.

Probier mal folgendes

Diese Funktionsdefinition in den head Bereich:

<script type="text/javascript">
function hideAd()
{
  var bodywidth;
  if (self.innerWidth) {
    bodywidth = self.innerWidth;
  } else if (document.documentElement && document.documentElement.clientWidth) {
    bodywidth = document.documentElement.clientWidth;
  } else if (document.body) {
    bodywidth = document.body.clientWidth;
  }
  if (bodywidth < 1280) {
      document.getElementById("werbung").style.display = "none";
  }
}
</script>

Die 1280 (minimale Breite in pixel, bei der Werbung angezeigt wird) gegebenenfalls anpassen

Die Funktion im onload Attribut des body aufrufen:

<body onload="hideAd()">

29.11.2013 15:35 | geändert: 29.11.2013 15:39

4 Jörg

Bei mir funktioniert das Ausblenden.

Du hast mit 800px allerdings eine sehr geringe Mindestbreite gewählt. Der Banner wird erst ausgeblendet, wenn die Bildschirmbreite geringer ist als 800px! Das Problem der Überlappung tritt ja schon bei unter 1280px auf.

29.11.2013 16:18

5 krieger98

Es klappt jetzt SUPER. Nochmal vielen Dank.
Wenn jetzt noch eine zweite Werbung ausblenden will mit dem Namen
"werbung-rechts" wie sieht das Script dann aus?

29.11.2013 17:08

6 Jörg

Da kannst du analog eine zweiten Anweisung einfügen:

  if (bodywidth < 1280) {
      document.getElementById("werbung").style.display = "none";
      document.getElementById("werbung-rechts").style.display = "none";
  }

29.11.2013 17:23

1 Forenmitglied fand diesen Beitrag gut

Beitrag schreiben (als Gast)





[BBCode-Hilfe]