bildwechsel mit verlinkung
kathrin
- javascript
ich habe folgendes problem:
fünf bilder nebeneinander, die ständig ausgewechselt werden durch 18 gleiche bilder. soweit funktioniert es ;-)
nun möchte ich aber jedes themenbild verlinken auf die zugehörige html-seite. mit dem jetzigen code passiert folgendes:
beim ersten laden verlinken alle fünf bilder auf den link vom ersten bild aus der reihe, ab dem ersten wechsel verlinken alle fünf bilder auf den link des fünften bildes aus der reihe.
wo liegt der fehler? jemand nen tipp? besten dank!
<script language="JavaScript">
<!--
var auftraggeber = 1;
function geheAuftraggeber(bildNr) {
var bildAuftraggeber = auftraggeber - bildNr;
if (bildAuftraggeber < 1) bildAuftraggeber = 18 + bildAuftraggeber;
if (auftraggeber == 1) {window.location.href = "ressort_auto.html";}
if (auftraggeber == 2) {window.location.href = "ressort_bauen.html";}
if (auftraggeber == 3) {window.location.href = "ressort_beruf.html";}
if (auftraggeber == 4) {window.location.href = "ressort_computer.html";}
if (auftraggeber == 5) {window.location.href = "ressort_ernaehr.html";}
if (auftraggeber == 6) {window.location.href = "ressort_familie.html";}
if (auftraggeber == 7) {window.location.href = "ressort_garten.html";}
if (auftraggeber == 8) {window.location.href = "ressort_geld.html";}
if (auftraggeber == 9) {window.location.href = "ressort_gesundheit.html";}
if (auftraggeber == 10) {window.location.href = "ressort_internet.html";}
if (auftraggeber == 11) {window.location.href = "ressort_jugend.html";}
if (auftraggeber == 12) {window.location.href = "ressort_lifestyle.html";}
if (auftraggeber == 13) {window.location.href = "ressort_multimedia.html";}
if (auftraggeber == 14) {window.location.href = "ressort_recht.html";}
if (auftraggeber == 15) {window.location.href = "ressort_reise.html";}
if (auftraggeber == 16) {window.location.href = "ressort_senioren.html";}
if (auftraggeber == 17) {window.location.href = "ressort_tiere.html";}
if (auftraggeber == 18) {window.location.href = "ressort_technik.html";}
}
function rotiere() {
if(++auftraggeber>18) auftraggeber = 1;
document.images[1].src = "images/bild" + auftraggeber + ".jpg";
if(++auftraggeber>18) auftraggeber = 1;
document.images[2].src = "images/bild" + auftraggeber + ".jpg";
if(++auftraggeber>18) auftraggeber = 1;
document.images[3].src = "images/bild" + auftraggeber + ".jpg";
if(++auftraggeber>18) auftraggeber = 1;
document.images[4].src = "images/bild" + auftraggeber + ".jpg";
if(++auftraggeber>18) auftraggeber = 1;
document.images[5].src = "images/bild" + auftraggeber + ".jpg";
window.setTimeout("rotiere()",4000);
}
//-->
</script>
auszug aus html:
<td class="bildstartseite"><a href="JavaScript:geheAuftraggeber(0);"><IMG SRC="images/bild1.jpg" NAME="bild" WIDTH="171" HEIGHT="124" BORDER="0"></a></td>
<td class="bildstartseite"><a href="JavaScript:geheAuftraggeber(1);"><IMG SRC="images/bild3.jpg" NAME="bild" WIDTH="171" HEIGHT="124" BORDER="0"></a></td>
<td class="bildstartseite"><a href="JavaScript:geheAuftraggeber(2);"><IMG SRC="images/bild6.jpg" NAME="bild" WIDTH="171" HEIGHT="124" BORDER="0"></a></td>
<td class="bildstartseite"><a href="JavaScript:geheAuftraggeber(3);"><IMG SRC="images/bild9.jpg" NAME="bild" WIDTH="171" HEIGHT="124" BORDER="0"></a></td>
<td class="bildstartseite"><a href="JavaScript:geheAuftraggeber(4);"><IMG SRC="images/bild12.jpg" NAME="bild" WIDTH="171" HEIGHT="124" BORDER="0"></a></td>
ich habe folgendes problem:<script type="text/javascript">
Ich würd das ganze anders umsetzten, da deine Code umständlich ist und nicht dass macht was du erwartest. Die einizige Änderung für dich wäre, dass du die Bilder anders indizieren musst. Ein Array startet immer bei der Zahl null, d.h. auto => bild0.jpg
Du könntest alternativ aber auch ein Array mit Bildern machen, das dann die Bildnamen enthält.
<script type="text/javascript">
var auf = new Array( "ressort_auto.html", "ressort_bauen.html",
"ressort_beruf.html", "ressort_computer.html", "ressort_ernaehr.html",
"ressort_familie.html", "ressort_garten.html", "ressort_geld.html",
"ressort_gesundheit.html", "ressort_internet.html", "ressort_jugend.html",
"ressort_lifestyle.html", "ressort_multimedia.html", "ressort_recht.html",
"ressort_reise.html", "ressort_senioren.html", "ressort_tiere.html","ressort_technik.html"
);
function rotiere()
{
var bilder = getObj('bild');
var link = getObj('link');
if(!bilder.length || !link.length) return alert('Fehler');
var aktuell = bilder.length + getAktuell(link[0].href);
alert(aktuell)
for(var i = 0;i < bilder.length; i++)
{
if(aktuell > auf.length) aktuell = 0;
bilder[i].src = "images/bild" + aktuell + ".jpg";
link[i].href = auf[aktuell++]
}
setTimeout('rotiere()', 4000);
}
function getAktuell(url)
{
alert(url);
for( var i = 0; i < auf.length;i++) if(url.indexOf(auf[i]) != -1) return i;
}
function getObj(name)
{
if(document.getElementsByName) return document.getElementsByName(name);
if(document.all) return document.all[name];
return document[name];
}
window.onload = rotiere;
</script>
</head>
<body>
<div class="bildstartseite">
<a href="ressort_auto.html" NAME="link"
<IMG SRC="images/bild1.jpg" NAME="bild" WIDTH="171" HEIGHT="124" BORDER="0"></a>
<a href="ressort_bauen.html" NAME="link"
<IMG SRC="images/bild3.jpg" NAME="bild" WIDTH="171" HEIGHT="124" BORDER="0"></a>
<a href="ressort_beruf.html" NAME="link"
<IMG SRC="images/bild6.jpg" NAME="bild" WIDTH="171" HEIGHT="124" BORDER="0"></a>
<a href="ressort_computer.html" NAME="link"
<IMG SRC="images/bild9.jpg" NAME="bild" WIDTH="171" HEIGHT="124" BORDER="0"></a>
<a href="ressort_ernaehr.html" NAME="link"
<IMG SRC="images/bild12.jpg" NAME="bild" WIDTH="171" HEIGHT="124" BORDER="0"></a>
</div>
</body>
</html>
einmal sehe ich keinen Sinn in einer Tabelle.
einmal kommt ein Array zum einsatzhttp://de.selfhtml.org/javascript/objekte/array.htm und das Skript ändert direkt die URL http://de.selfhtml.org/javascript/objekte/links.htm#location
Der Vorteil ist auch, dass es zumindest teilweise auch ohne JS funktioniert, was man in Anbetracht von grossen Sicherheitslöchern im IE nie vorraussetzen sollte.
Struppi.
das scheint zu funktionieren ;-)
vielen, vielen dank!
p.s. tabelle hat in dem fall schon seinen grund, das war ja nur ein kleiner auszug aus der html-datei....