IMGセレクターver0.03
N4.0b3対応版(N4で動かなくてもいい方は^^;;ちょっぴり高機能なver0.02をどうぞ)
ボタンに触ると画像が切り替わり、クリックすると指定したリンクを読み込みます(リンク先のページは省略しました(^^;;)。ここで使っている画像はすこし重たくてうっとうしいので改造時にはその辺も考慮されることをお薦めします。それにしても、雑なNo画像なんとかしろよー^^;;;;
このスクリプトは商用非商用問わず著作権フリーです。使用している画像を含めてコピー改造再配布等になんの制限も設けません。まったく自由に使っていただいて結構です(^^)。
N4.0b3Win95版でver0.02のdocument.writeが正常に動作しないので画像構築
をHTMLによる書きだしに変更しました。したがって、ver0.02でdocument.write
まわりに付加したボタンの桁数を可変機能は使えません。ボタンの桁数を変えたい
時はHTMLをこつこつ書き換えてレイアウトしてください(^^;;。
画像ディレクトリの設定もやめたので機能的には2歩後退ですが、プログラムは動い
てなんぼ^^;;ですから...。N4正式版ではうまくいくことを期待しつつ......
N4.0b3のdocument.writeの動作不良回避をご存じの方は教えてくださいな。
----------------------------------------------------------------
4/11/1997 ver0.03 (IMG構築をHTMLに変更--N4対策)
4/ 9/1997 ver0.02 (ボタンの桁数を可変にしました)
4/ 8/1997 ver0.01
----------------------------------------------------------------
Sample
Source
ソース
(コピーしてお使いください)
<![CDATA[
<HTML>
<HEAD>
<TITLE></TITLE>
]]><![CDATA[
<SCRIPT LANGUAGE="JavaScript1.1">
<!--
/***************************************************
JavaScript IMGセレクターver0.03(Netscape3.0以上必須/N4b3対応版)
4/8/1997
高橋登史朗(tato@fureai.or.jp)
http://www.fureai.or.jp/~tato/Emenu.htm
-----------------------------------------------------------
商用非商用問わず著作権フリーです。使用している画像を含めて
コピー改造再配布等になんの制限も設けません。まったく自由です。
****************************************************/
//画像処理ここから--------------------------------------------
//ページ内にはここで使うphoto画像やボタンの前に画像が何枚ありますか?
var imgoffset=0;//ボタン画像
/*
photo画像の事前読み込み
ここの画像ファイルを取り替えるとオリジナルになります。
*/
if(navigator.appVersion.charAt(0)>=3)
{
movimg=new Array()
movimg[0] = new Image();movimg[0].src='HATUHI.GIF';
movimg[1] = new Image();movimg[1].src='HAKEN.GIF';
movimg[2] = new Image();movimg[2].src='BOTAN.GIF';
movimg[3] = new Image();movimg[3].src='ISHI.GIF';
movimg[4] = new Image();movimg[4].src='HOKUSAI.GIF';
movimg[5] = new Image();movimg[5].src='HONB.GIF';
movimg[6] = new Image();movimg[6].src='HOZAKI.GIF';
movimg[7] = new Image();movimg[7].src='KAWARA.GIF';
movimg[8] = new Image();movimg[8].src='CHOZU.GIF';
movimg[9] = new Image();movimg[9].src='TEIEN.GIF';
};
/*
ボタンイメージの事前読み込みだよん
このボタンイメージを取り替えればオリジナルボタンになります
ここではB0on.jpg,B1on.jpg,B2on.jpg.....
という風に連番のファイル名を付けて使っています。
*/
if(navigator.appVersion.charAt(0)>=3)
{
//まずonボタンイメージを10枚
Bonimg = new Array();
for(i=0;i<10;i++)
{
Bonimg[i] = new Image();
Bonimg[i].src = "B"+i+"on.jpg";
};
//次にoffボタンイメージを10枚
Boffimg = new Array();
for(j=0;j<10;j++)
{
Boffimg[j] = new Image();
Boffimg[j].src = "B"+j+"off.jpg";
};
};
//ボタン画像のon/offとサンプル写真の書き換え
function Bon(Bno)
{
if(navigator.appVersion.charAt(0)>=3)
{
document.images[imgoffset+Bno].src=Boffimg[Bno].src;
document.dai.src=movimg[Bno].src;
};
};
function Boff(Bno)
{
if(navigator.appVersion.charAt(0)>=3)
{
document.images[imgoffset+Bno].src=Bonimg[Bno].src;
};
};
//画像処理ここまで--------------------------------------
//リンク処理ここから------------------------------------
//リンク先のBASE HREFがあれば設定(HTMLと同じなら"")
var LinkHref1="" ;
/*
リンク先の設定
*/
LinkURL=new Array()
LinkURL[0]=LinkHref1+"LINKP0.HTM"
LinkURL[1]=LinkHref1+"LINKP1.HTM"
LinkURL[2]=LinkHref1+"LINKP2.HTM"
LinkURL[3]=LinkHref1+"LINKP3.HTM"
LinkURL[4]=LinkHref1+"LINKP4.HTM"
LinkURL[5]=LinkHref1+"LINKP5.HTM"
LinkURL[6]=LinkHref1+"LINKP6.HTM"
LinkURL[7]=LinkHref1+"LINKP7.HTM"
LinkURL[8]=LinkHref1+"LINKP8.HTM"
LinkURL[9]=LinkHref1+"LINKP9.HTM"
function meirei(Bno)
{
if(navigator.appVersion.charAt(0)>=3)
{
window.location.href=LinkURL[Bno]
};
};
//リンク処理ここまで------------------------------------
<!---->
</SCRIPT>
]]><![CDATA[
</HEAD>
<BODY>
<CENTER>
<!--画像の構築-->
<A
HREF="javascript:meirei(0)"
onMouseOver="Bon(0)" onMouseOut="Boff(0)"
><IMG
BORDER=0 NAME="B0"
SRC="B0on.jpg"
WIDTH="12" HEIGTH="24"
></A><A
HREF="javascript:meirei(1)"
onMouseOver="Bon(1)" onMouseOut="Boff(1)"
><IMG
BORDER=0 NAME="B1"
SRC="B1on.jpg"
WIDTH="12" HEIGTH="24"
></A><A
HREF="javascript:meirei(2)"
onMouseOver="Bon(2)" onMouseOut="Boff(2)"
><IMG
BORDER=0 NAME="B2"
SRC="B2on.jpg"
WIDTH="12" HEIGTH="24"
></A><A
HREF="javascript:meirei(3)"
onMouseOver="Bon(3)" onMouseOut="Boff(3)"
><IMG
BORDER=0 NAME="B3"
SRC="B3on.jpg"
WIDTH="12" HEIGTH="24"
></A><A
HREF="javascript:meirei(4)"
onMouseOver="Bon(4)" onMouseOut="Boff(4)"
><IMG
BORDER=0 NAME="B4"
SRC="B4on.jpg"
WIDTH="12" HEIGTH="24"
></A><A
HREF="javascript:meirei(5)"
onMouseOver="Bon(5)" onMouseOut="Boff(5)"
><IMG
BORDER=0 NAME="B5"
SRC="B5on.jpg"
WIDTH="12" HEIGTH="24"
></A><A
HREF="javascript:meirei(6)"
onMouseOver="Bon(6)" onMouseOut="Boff(6)"
><IMG
BORDER=0 NAME="B6"
SRC="B6on.jpg"
WIDTH="12" HEIGTH="24"
></A><A
HREF="javascript:meirei(7)"
onMouseOver="Bon(7)" onMouseOut="Boff(7)"
><IMG
BORDER=0 NAME="B7"
SRC="B7on.jpg"
WIDTH="12" HEIGTH="24"
></A><A
HREF="javascript:meirei(8)"
onMouseOver="Bon(8)" onMouseOut="Boff(8)"
><IMG
BORDER=0 NAME="B8"
SRC="B8on.jpg"
WIDTH="12" HEIGTH="24"
></A><A
HREF="javascript:meirei(9)"
onMouseOver="Bon(9)" onMouseOut="Boff(9)"
><IMG
BORDER=0 NAME="B9"
SRC="B9on.jpg"
WIDTH="12" HEIGTH="24"
></A><BR>
<IMG
BORDER=0 NAME="dai"
SRC="KAWARA.GIF"
WIDTH="120" HEIGTH="80"><BR>
</CENTER>
</BODY>
</HTML>
]]>
使用している画像:
B0on.jpg B1on.jpg B2on.jpg B3on.jpg B4on.jpg
B5on.jpg B6on.jpg B7on.jpg B8on.jpg B9on.jpg
B0off.jpg 
B1off.jpg 
B2off.jpg 
B3off.jpg 
B4off.jpg
B5off.jpg 
B6off.jpg 
B7off.jpg 
B8off.jpg 
B9off.jpg
HATUHI.GIF 
HAKEN.GIF 
BOTAN.GIF
ISHI.GIF 
HOKUSAI.GIF 
HONB.GIF
HOZAKI.GIF KAWARA.GIF 
CHOZU.GIF 
TEIEN.GIF
ご意見、ご要望、バグ、文句、苦情、陳情は下記まで。
Maintained by
tato@fureai.or.jp works1997 Toshirou Takahashi