<![CDATA[
<HTML>
<HEAD>
<META http-equiv="Content-Script-Type" content="text/javascript">
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=Shift_JIS">
<TITLE>民具</TITLE>
<script language="javascript">
<!--
//初期設定
img_w=150;//写真の横幅
img_h=200;//写真の縦幅
mv_flg=0;at_flg=0;
s=0;x=0;y=0;
scr_w=screen.width;img_col=(scr_w-400)/5;
dt=new Array();img_id=new Array();
//データ ”ファイル名 ，名称 ，コメント”；
n=0;
n++;dt[n]="s01.jpg,汁桶,多くの人が会食する時に使う、味噌汁を入れる桶";
n++;dt[n]="s02.jpg,手洗い桶,顔を洗う桶";
n++;dt[n]="s03.jpg,膳箱,個人別に茶碗や箸を入れておき、蓋を裏返すと膳になる。";
n++;dt[n]="s04.jpg,魚篭,田圃などに弁当をいれて持っていく";
n++;dt[n]="s05.jpg,斗枡,米などを計るマス（１斗＝１８リットル）";
n++;dt[n]="s06.jpg,手桶,井戸から水を運ぶ桶";
n++;dt[n]="s07.jpg,消壷,炭を消す壷（炭は再利用する）";
n++;dt[n]="s08.jpg,茶釜,お湯を沸かす";
n++;dt[n]="s09.jpg,お釜,蒔きや藁でご飯を炊く釜";
n++;dt[n]="s10.jpg,糸繰り機,綿や繭から撚りをかけて糸を紡ぐ";
n++;dt[n]="s11.jpg,綿刳機,綿の実から種を取り除く";
n++;dt[n]="s12.jpg,石臼,米や豆から粉を挽く";
n++;dt[n]="s13.jpg,小便桶,小便を田畑に運んで肥料として散布する";
n++;dt[n]="s14.jpg,押切り,藁を切断して牛馬の餌を作る";
n++;dt[n]="s15.jpg,縄綯機,縄を足踏み式で綯う機械";
n++;dt[n]="s16.jpg,脱穀機,稲の穂を足踏み式で脱穀する機械";
n++;dt[n]="s17.jpg,唐箕,脱穀したモミと混ざったゴミを風力で仕分ける機械";
n++;dt[n]="s18.jpg,消防ポンプ,手押し式消火ポンプ車";
//移動開始
function sw_on(no){
if(at_flg==1){
alert("自動実行中");
return;
}
id0="m_"+no;
mv_flg=no*1;
if ( document.layers ) {
xx = e.layerX;
yy = e.layerY;
} else {
xx = event.offsetX;
yy = event.offsetY;
}
}
//ドロップ
function sw_off(no){
if(at_flg==1){
//alert("自動実行中");
return;
}
id0="m_"+no;
id1="m_"+(n+no);
mv_flg=0;
if(no<=n){
document.getElementById( id1 ).style.left = x;
document.getElementById( id1 ).style.top = y;
document.getElementById( id0 ).style.visibility="hidden";
document.getElementById( id1 ).style.visibility="visible";
document.getElementById( id0 ).style.left = 0;
document.getElementById( id0 ).style.top = -300;
}
}
//ドラッグ
function mv(){
if(mv_flg>0){
mx = document.body.scrollLeft + event.clientX;
my = document.body.scrollTop + event.clientY;
x = mx - xx;
y = my - yy;
if ( document.layers ) {
document.layers[ id0 ].moveTo( x, y );
} else {
document.getElementById( id0 ).style.left = x;
document.getElementById( id0 ).style.top = y;
}
return false;
}
}
//自動めくり
function at(){
if(at_flg==1){
kotei();
clearTimeout(atsub_tim);
at_flg=0;
document.myform.at_sw.value="自動めくり";
return;
}
document.myform.at_sw.value="手 めくり";
if(s>n){
back();
s=0;
}
at_flg=1;
xy_set()
at_sub();
}
function xy_set(){
sx1=(100-(s-n/2)*2);
sy1=(n-s)*2+150;
sx2=((s-1)%5)*img_col+300+Math.floor((s-1)/5)*5;
sy2=Math.floor((s-1)/5)*img_col*1.4+100+((s-1)%5)*5;
sx3=(sx2-sx1)/20;
sy3=(sy2-sy1)/20;
id0="m_"+s;
id1="m_"+(n+s);
j=0;
s++;
}
function at_sub(){
j++;
if(j>20){
kotei();
xy_set();
if(s>n){
//s=0;
clearTimeout(atsub_tim);
at_flg=0;
document.myform.at_sw.value="自動めくり";
return;
}
}
x=sx1+sx3*j
y=sy1+sy3*j;
document.getElementById( id0 ).style.left = x;
document.getElementById( id0 ).style.top = y;
atsub_tim=setTimeout("at_sub()",100);
}
function kotei(){
document.getElementById( id1 ).style.left=x;
document.getElementById( id1 ).style.top=y;
document.getElementById( id0 ).style.visibility="hidden";
document.getElementById( id1 ).style.visibility="visible";
document.getElementById( id0 ).style.left = 0;
document.getElementById( id0 ).style.top = -300;
}
//配置の初期化
function back(){
if(at_flg==1){
alert("自動実行中");
return;
}
s=0;
for(i=1;i<=n;i++){
id0="m_"+i;
id1="m_"+(n+i);
document.getElementById( id1 ).style.left = 0;
document.getElementById( id1 ).style.top = -300;
document.getElementById( id1 ).style.visibility="hidden";
document.getElementById( id0 ).style.left =(100-(i-n/2)*2);
document.getElementById( id0 ).style.top = (n-i)*2+150;
document.getElementById( id0 ).style.visibility="visible";
}
}
function win(w){
dd=dt[w].split(",");
ww=window.open("kakudai.htm?"+dt[w],"民具","width=460,height=600,top=0,left=0");
}
//イベント
nav=navigator.appName.substring(0,1);
if(nav=="N"){
document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE | Event.MOUSEUP);
}
document.onmousemove = mv;
//-->
</script>
</HEAD>
<BODY bgcolor=#ffffff >
<center>
<font size=6>昭和の民具</font><br>
(本地新田郷土資料館)<br><br>
<table border=0 width=90% >
<tr><td width=300 valign=top>
<table border=0 width=90% >
<tr><td height=400 valign=top>
<form name="myform">
<input type=button value="元に戻す" onClick="back()">
<input type=button value="自動めくり" onClick="at()" name="at_sw">
</form>
</td></tr>
<tr><td>
カードをマウスボタンを押したまま移動（ドラッグ）してご覧ください。<br>
移動後はダブルクリックで拡大表示できます。<br>
（ネットスケープは調整中）<br>
</td></tr></table>
</td><td>
懐かしい、昭和の、家庭や農家で使われた道具類を集めてみました。<br>
<script language="javascript">
<!--
//一覧表
document.write('<table border=1 width=100%><tr><th width=100>名称</th><th>説明</th></tr>\n');
for(i=1;i<=n;i++){
dd=dt[i].split(",");
document.write('<tr><td align=center>',dd[1],'</td><td>',dd[2],'</td></tr>\n');
}
document.write('</table>');
//-->
</script>
</td></tr></table>
<script language="javascript">
<!--
//表カード
for(i=1;i<=n;i++){
dd=dt[i].split(",");
document.write('<div id="m_',i,'" style="position:absolute;top:',(n-i)*2+150,';');
document.write('left:',(100-(i-n/2)*2),';z-index:',(n*2-i),';visibility:visible"');
document.write(' onmouseDown="sw_on(',i,');return false;" ');
document.write(' onmouseUp="sw_off(',i,');return false;" >');
document.write('<table border=1 bgcolor=#ffffff><tr><td align=center>');
document.write(dd[1],'<br><img src="',dd[0],'" width=',img_w,' height=',img_h),'>';
document.write('<br></td></tr></table></div>');
}
//シャドー
for(i=1;i<=n;i++){
dd=dt[i].split(",");
document.write('<div id="m_',(n+i),'" style="position:absolute;top:-300;left:0;');
document.write('z-index:',(i),';visibility:hidden"');
document.write(' onmouseDown="sw_on(',(n+i),');return false;" ');
document.write(' onmouseUp="sw_off(',(n+i),')" ondblclick="win(',i,');return false;">');
document.write('<table border=1 bgcolor=#ffffff><tr><td align=center>');
document.write(dd[1],'<br><img src="',dd[0],'" width=',img_w,' height=',img_h,'>');
document.write('<br></td></tr></table></div>');
}
//-->
</script>
</BODY>
</HTML>
]]>
|
