<html>
<head>
<meta charset="utf-8">
<!--meta charset="shift_jis"-->
<!--meta name="viewport" content="width=device-width"-->
<title>田植えの終わった大山千枚田</title>
<style>
#win {position:absolute;top:0;left:0;width:100%;height:100vh;background:#000000;z-index:1;}
#win img{position:absolute;top:0;bottom:0;left:0;right:0;;outline: 10px solid #FFFFFF;margin:auto}
#sum {position:absolute;top:0;left:0;width:100%;z-index:2;background:#000000;z-index:2;display:inline;}
#sum img{width:320px;height:213px;outline: 10px solid #FFFFFF;}//cursor:pointer;}
</style>
<script>
/*拡大表示*/
function op(s){
jpg_no=s;
document.getElementById("syasin").src=dt[jpg_no]+".jpg";
document.getElementById("win").style.zIndex=3;
document.getElementById("win").style.top=window.scrollY;
document.getElementById("sum").style.display="none";
}
/*次へ*/
function next(){
ss=(jpg_no+1)%n;
op(ss);
}
/*閉じる*/
function cls(){
document.getElementById("sum").style.display="inline";
document.getElementById("win").style.zIndex=1;
}
</script>
</head>
<body style="margin:0">
<center>
<!--div id="win" onClick="cls()" onContextmenu="next();return false;"-->
<div id="win" onClick="cls();" onContextmenu="next();return false;" onMousewheel="return false;" onTouchstart="tim_on();return false;" onTouchend="tim_cls();return false;" >
<img id="syasin" src="" title="左=閉る／右=次へ">
</div>
<div id="sum" >
<table align="center">
<tr>
<th>
<b><font size="5" color="#ffffff">田植えの終わった大山千枚田</font></b><br><br>
<b><i><u><font size="3" color="#ffffff"> 千葉県指定名勝の「鴨川大山千枚田」</font></u></i></b><br><br>
</th></tr>
<tr><td>
<b><i><u><font size="3" color="#ffffff">
総面積約4haもの広い急傾斜地に、階段のように大小375枚の田んぼが連なる棚田は、<br>
今では珍しくなった日本の故郷を感じられます。</font></b><br>
</font></u></i></b><br>
</td>
</tr>
</table>
<script>
//写真ファイル名 拡張子は「.jpg」のこと////////////
jpg_dt="01,02,03,04,05,06,07,08,09,10,11,12,13,14,15,16";
xn=2;//横並び数
////////////////////////////////////////////////////
dt=jpg_dt.split(",");
n=dt.length;
//サムネール
for(i=0;i<n;i++){
dd=dt[i]+'.jpg';
document.write('<img src="',dd,'" onClick="op(',i,');" onContextmenu="return false;" title="拡大">');
if(i%xn==1){document.write('<br>');}
}
</script>
<br>
メモ帳でタグ書きしたＨＴＭＬ
</div>
</center>
</body>
</html>