Supportnet Computer
Planet of Tech

Supportnet / Forum / Webseiten/HTML

Zentrale-Bannerdatei nachladbar ?





Frage

Hi @all, brauche bitte ne Lösung für folgendes Problem: Auf einer zentralen Datei (css htm, oder sonst was) sollen Banner so "verwaltet" werden - sprich ne normale HTML-Datei, die eine Banner-Rotation per JS "ausgibt". Diese Datei soll von versch. Dokumenten (htm) "nachgeladen" bzw. "inkludiert" werden. Der Hintergedanke dabei ist, dass ich bei Banner-Änderungen eben nur diese eine zentrale Banner-Datei ändern muss. Ich möchte dieses Prob. nicht per PHP lösen, denn die Website muss "flexibel" (portierbar) bleiben. Jemand ne Idee ? Wäre seehr dankbar für jeden Anreiz. Cu Daniel

Antwort 1 von sutadur

Gerade wenn es um Flexibilität geht, scheint mir PHP eine gute Wahl zu sein. Höhere Kompatibilität erreichst Du mit JavaScript sicher auch nicht.

Antwort 2 von regi34

wo ist das Problem?
das Script einfach mit JS so aufbaun, wie man es auch mit PHP machen würde (mit dass man die Bild-URLs und die Ziel-URLs der Banner nicht aus einer Datenbank holt sondern eben in eine Datei schreibt.

Die HTML-datei die dann also überall inkludiert werden soll beinhaltet dieses JS, das wiederum greift auf die Datei mit den Bild-URLs und den Ziel-URLs zu.

Antwort 3 von rfb

das geht schon mit JS, wenn auch dann nur bei Browsern, die JS unterstützen und bei denen dies nicht deaktiviert (oder eingeschränkt) ist.

einfach mit
<script type="text/javascript" src="banner.js"></script>

im head-Bereich der Seiten einbinden.

denkbarer Aufbau von banner.js:
function bannerladen() {
var banner=new Array("b1.jpg","b2.jpg",..."bn.jpg");
var hrefs=new Array("www.irgendwo1.de",...,"www.irgendwon.de");
var j=Math.round(Math.random*(banner.length-1));
document.getElementById("banner").href=hrefs[j];
document.getElementById("banner").firstChild.src=banner[j];
}


Aufruf:
<body onload="bannerladen()">


und hier wirkt es sich aus:
<a href="standard.htm" id="banner"><img src="standard.jpg" width="???" height="???" alt="Hier kommt ein Banner"></a>


Antwort 4 von Hilfesucher

@ sutadur: Ich möchte, dass die Website auch auf Servern läuft, die ohne PHP laufen.
Abgesehen davon, finde ich es eine unnötige belastung für den Server.

@ regi34: Siehe @rfb.


@ rfb:

Ja, genau sowas wollte ich machen, aber es hat nicht funktioniert :-(

Deshalb poste ich jetzt einfach mal die Quellcodes hierher (hoffe hat niemand was dagegen):

Banner-Rotation.js:
---------------------------

// Banner-Rotation

today=new Date();
jran=today.getTime();
var anzahl = 2; // Anzahl der Bilder
var random_number="";
var image="";
var banner_name="";
var target="";
var url="";
var ALT_Text ="";
ia=9301;
ic=49297;
im=233280;
jran = (jran*ia+ic) % im;

random_number = Math.ceil( (jran/(im*1.0)) * anzahl);

// läd ein Image abhängig von der Zufallszahl

if (random_number==1) {
banner_name=".\banner_1.gif";
target="_blank";
url="http://adresse.de";
ALT_Text="ALT-Text hier ...";
}
if (random_number==2) {
banner_name=".\banner_2.gif";
target="_blank";
url="http://www.irgendwo.de";
ALT_Text="ALT-Text hier ...";
}


function zufallsbanner() {
document.write("<a href=´" + url + "´" + target +">");
document.write("<img src=´" + banner_name + "´" + "border=´1´ alt=´" + ALT_Text + "´>");
document.write("</a>);
return
}
---------------------------

Und nun die Index.htm:
(hier stark verkürzt - beinhaltet sämtliche Tabellen, etc.)
---------------------------
<html>
<head>

...
<script src="..\banner\banner_rotation.js" type="text/javascript"></script>
...

</head>

<body>

...
<table border="0" cellpadding="6" width="100%" cellspacing="3">
<tr>
<td width="100%" align="center" bgcolor="#FFFFFF">

<script type="text/javascript">
<!--
zufallsbanner();
//-->
</script>

</td>
</tr>
</table>
...

</body>
</html>
---------------------------

So, aber es funztioniert net :-(
(Hab noch nicht so viel Ahnung von JS.)

Wäre net wenn Du mir die Fehler aufzeigen könntest.

Thx
Daniel

Antwort 5 von sutadur

Zitat:
Ich möchte, dass die Website auch auf Servern läuft, die ohne PHP laufen.
Du möchtest doch aber sicher auch, dass das auf Rechnern läuft, die kein JavaScript aktiviert haben. Man mag darüber streiten können, was nun wahrscheinlicher ist, aber ich denke, mit der PHP-Variante bist Du "global betrachtet" besser dran. Die Belastung auf dem Server ist für solche Zwecke minimal.

Antwort 6 von regi34

da muss man Sutadur schon zustimmen, es macht normal mehr sinn es mit PHP zu machen, da die Funktionstüchtigkeit dann nur vom Server abhängt und nicht wie bei JS vom Client.

Habe jetzt leider nicht die Zeit mich länger mit dem Script zu beschäftigen verweise da aber mal auf www.tutorials.de

Antwort 7 von rfb

Nachfrage: was soll die extrem komplizierte Zufallszahlbestimmung??
Warum nutzt du nicht einfach
Math.random()


wobei mir auffällt: in meinem Script fehlen die Klammern bei
Math.random()


Die Nachteil deiner Variante sind
- ohne JS passiert gar nix (während bei mir irgendein Standard-Wert geladen wird)
- die vielen Variablen und die if-Abfragen blähen den Code unnötig auf
- mit den write-Anweisungen produzierst ein paar HTML-Fehler durch fehlende Leerzeichen im Code

Antwort 8 von Hilfesucher

Zitat:
Nachfrage: was soll die extrem komplizierte Zufallszahlbestimmung??
Warum nutzt du nicht einfach Math.random()


Ja, das war mein ursprünglicher Code.
Ich wollte ja eigentlich wissen, was an dem Ding falsch ist.

Wegen den vielen IF-Abfragen - stimmt, aber ich kappier deinen Code nicht so ganz:

Zitat:
var j=Math.round(Math.random*(banner.length-1));


Was wird in diese Variable übergeben ?
Die Länge der Bild-Datei minus ein zeichen - also ohne die Nr. ?

Zitat:
document.getElementById("banner").href=hrefs[j];
document.getElementById("banner").firstChild.src=banner[j];


Und was passiert hierbei ?

Gruß
Daniel

PS: Aber das Prob. bleibt.
Banner werden so und so nicht ausgegeben :-(

Antwort 9 von rfb

var j=Math.round(Math.random()*(banner.length-1)); 

banner.length ist die Anzahl der Elemente im Array banner, also der Liste der Bildnamen.
der Index in diesem Array geht von 0 bis banner.length-1.
die beiden Math.random() - hier hatte ich wie gesagt die Klammern vergessen - ist eine Zufallsfunktion mit Werten von 0-1, Math.round ist eine Rundungsfunktion.

das Ganze liefert eine ganze Zufallszahl im Wertebereich 0 bis banner.length-1

document.getElementById("banner").href=hrefs[j];

bedeutet: das Linkziel in dem a-Tag mit der ID "banner" hat ab sofort den Wert der im Array hrefs beim Index j steht.
document.getElementById("banner").firstChild.src=banner[j];

bedeutet das Bild innerhalb o.g. a-tags hat als Quelldatei ab sofort das Bild das im Array banner beim Index j steht.
(dies setzt natürlich voraus dass immer das entsprechende Wertepaar in banner und hrefs beim gleichen Index gespeichert ist ;-)

Wenn mein Code nicht funktioniert hat, dann wegen Math.random()

Ich möchte kostenlos eine Frage an die Mitglieder stellen:


Ähnliche Themen:


Suche in allen vorhandenen Beiträgen: