Mac Safari und Javascript
Per
- browser
Hallo,
ich habe folgendes, mir unerklärliches Problem:
Ich habe ein javascript in einer html-Datei, das Folgendes bewirken soll: Ein gif soll ohne erneutes Laden der html-Datei durch klicken auf den "next"-button ausgetauscht werden. Beginnend mit 01.gif, dann 02.gif, dann 03.gif, und dann weiter als Schleife, wieder mit 01.gif beginnend. Oder das gleiche Prinzip umgekehrt mit dem "prvious"-button.
Also eine einfacher Durchlauf durch eine Galerie.
Funktioniert auch auf allen von mir getesteten Browsern, aber leider nicht auf Safari. Da funktioniert bei der älteren Version gerade mal ein Durchlauf (01->02->03->01), dann geht es nicht weiter, bei der aktuellen Version funktioniert gerade mal ein oder zwei Klicks, dann ist schon alles taub.
Bitte schreibt mir jetzt nicht, dass Safari sowieso doof ist und kein Mensch Safari verwendet - mein Auftraggeber verwendet Ihn.
Ich wäre sehr dankbar, wenn jemand das Problem oder besser dessen Lösung kennt, denn ich weiss nicht mehr weiter.
Folgend der link, falls jemand probieren möchte:
http://www.momproductions.de/123/123.html
oder der code:
<html>
<head>
<title>...1-2-3-1-2-3-1-2-3-1-2-3...</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">
<!--
var current_index = 1;
// HIER DIE ANZAHL DER BILDER IN EINER GALLERIE AENDERN
var max_image = 3
var displayImages = new Array;
for(var i = 1; i < max_image+1; i++) {
displayImages[i] = 0;
}
var menuNormal = new Array;
// MENUE NORMAL
// Portfolio
menuNormal[0] = new Image;
menuNormal[0].src="pohg.gif";
// Hauptbild
menuNormal[1] = new Image;
// Leergifs
menuNormal[2] = new Image;
// Previous
menuNormal[3] = new Image;
menuNormal[3].src="prhg.gif";
// Next
menuNormal[4] = new Image;
menuNormal[4].src="nehg.gif";
// Leergifs
menuNormal[5] = new Image;
menuNormal[6] = new Image;
// MENUE HIGHLIGHT
var menuHighlight = new Array;
// Portfolio
menuHighlight[0] = new Image;
menuHighlight[0].src="podg.gif";
// Hauptbild
menuHighlight[1] = new Image;
// Leergif
menuHighlight[2] = new Image;
// Previous
menuHighlight[3] = new Image;
menuHighlight[3].src="prdg.gif";
// Next
menuHighlight[4] = new Image;
menuHighlight[4].src="nedg.gif";
// Leergifs
menuHighlight[5] = new Image;
menuHighlight[6] = new Image;
function menuOver(index) {
document.images[index].src = menuHighlight[index].src;
}
function menuOut(index) {
document.images[index].src = menuNormal[index].src;
}
function switchImage(direction) {
if(direction == true){
current_index++;
if(current_index > max_image || current_index == 0) {
current_index = 1;
}
}
else{
current_index--;
if(current_index < 1) {
current_index = max_image;
}
}
if(displayImages[current_index] == 0){
displayImages[current_index] = new Image;
var name = 0;
if(current_index < 10){
name = "0"+current_index+".gif";
}
else{
name = current_index+".gif";
}
displayImages[current_index].src = name;
document.images[1].src = displayImages[current_index].src;
}
else{ document.images[1].src = displayImages[current_index].src; }
}
function linie(x)
{ if (document.all) x.blur(); }
function preloadImages() {
var d=document; if(d.images){ if(!d.p) d.p=new Array();
var i,j=d.p.length,a=preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.p[j]=new Image; d.p[j++].src=a[i];}}
}
//-->
</script>
</head>
<body bgcolor="#FFFFFF" onLoad="preloadImages('nedg.gif','prdg.gif','podg.gif')">
<table width="800" border="0" cellspacing="0" cellpadding="0" align="center" height="100%">
<tr>
<td>
<table width="800" border="0" cellspacing="0" cellpadding="0" align="center" height="525">
<tr>
<td valign="top" height="20"> <a href="#" onClick="linie(this);" onMouseOver="menuOver(0)" onMouseOut="menuOut(0)">
<img name="po" border="0" src="podg.gif" width="75" height="20"></a></td>
<td rowspan="3"><img src = "01.gif" width="650" height="525"></td>
<td valign="top"><img src="l.gif" width="75" height="20"></td>
</tr>
<tr>
<td valign="middle" height="485"> <a href="javascript:switchImage(false)" onClick="linie(this);" onMouseOver="menuOver(3)" onMouseOut="menuOut(3)">
<img name="pr" border="0" src="prhg.gif" width="75" height="14"></a></td>
<td valign="middle"> <a href="javascript:switchImage(true)" onClick="linie(this);" onMouseOver="menuOver(4)" onMouseOut="menuOut(4)">
<img name="n1" border="0" src="nehg.gif" width="75" height="14"></a></td>
</tr>
<tr>
<td valign="bottom" height="20"><img src="l.gif" width="75" height="20"></td>
<td height="20" valign="bottom"><img src="l.gif" width="75" height="20"></td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
Vielen Dank schon mal,
Per