FIRE FOXで動かないJAVA SCRIPT
ieやChromeでは正常に動くのですがFIRE FOXのみ正しく動作してくれません。
どこが間違っているのか教えてください。
FIREFOXでは1～5の画像は順に動いてくれるのですがサムネイルをクリックしても反応がおきません。
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript">
</script>
<script src="javascripts/jquery.megamenu.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(function(){
var SelfLocation = window.location.href.split('?');
switch (SelfLocation[1]) {
case "justify_right":
jQuery(".megamenu").megamenu({ 'justify':'right' });
break;
case "justify_left":
default:
jQuery(".megamenu").megamenu();
}
});
/* 表示させたい画像へのパスをカンマで区切って記述する */
var gazo = new Array(
"http://画像1.jpg",
"http://画像2.jpg",
"http://画像3.jpg",
"http://画像4.jpg",
"http://画像5.jpg"
);
/* 表示させたい画像の順番に合わせてリンク先のパスをカンマで区切って記述する */
var link = new Array(
"http://リンク1",
"http://リンク2",
"http://リンク3",
"http://リンク4",
"http://リンク5"
);
var timer;
var x = 0;
function show(num)
{
clearTimeout(timer);
/* サムネイル画像がクリックされた時はxの数値を変更します */
if (num != 999)
{
x = num;
}
/* id名がancのaタグのリンクを変更します */
document.getElementById('anc').setAttribute('href', link[x]);
/* id名がmainphotoの中になるimgタグの画像を変更します */
$("#mainphoto img").before("<img src='"+gazo[x]+"' alt=''>");
/* fadeOutの速度は、slow、normal、fast、もしくは完了までの時間をミリ秒単位で指定します。*/
$("#mainphoto img:last").fadeOut("normal",function(){
$(this).remove()
});
/* 何枚目の画像を表示するか設定します。
変数xで何枚目かを管理します。show()が実行される度にxの値を1加算します。
gazo.lengthでgazo配列の要素の数が分かります。
画像は0番目から数えるので「スライドする画像の数 - 1」の値になれば0に戻します */
if ( x == gazo.length - 1 ) /* 「スライドする画像の枚数 - 1 」の値を設定 */
{
x = 0; /* 画像の番号を0(1枚目)に戻す */
}
else
{
x = x + 1; /* 画像の番号を1つ進める */
}
/* 「setTimeout("show()", 3000)」の3000でスライドする時間を変更します。 3000は3秒です。*/
timer = setTimeout("show(999)", 3000);
};
</script>
html部分↓
<p id="mainphoto">
<a href="リンク1"><img src="画像1" width="950" height="300" /></a>
</p>
<table width="950px">
<tr>
<td width="20%" align="center">
<a href="JavaScript:show(0)"><img src="画像1" width="180"></a>
</td>
<td width="20%" align="center">
<a href="JavaScript:show(1)"><img src="画像2" width="180"></a>
</td>
<td width="20%" align="center">
<a href="JavaScript:show(2)"><img src="画像3" width="180"></a>
</td>
<td width="20%" align="center">
<a href="JavaScript:show(3)"><img src="画像4" width="180"></a>
</td>
<td width="20%" align="center">
<a href="JavaScript:show(4)"><img src="画像5" width="180"></a>
</td>
</tr>
</table>
