Team:Tokyo-NoKoGen/Team/Photogalary

From 2012.igem.org

(Difference between revisions)
Line 1: Line 1:
{{Template:Team:Tokyo-NoKoGen/contents_header}}
{{Template:Team:Tokyo-NoKoGen/contents_header}}
{{Template:Team:Tokyo-NoKoGen/index_team}}
{{Template:Team:Tokyo-NoKoGen/index_team}}
 +
<html>
<html>
 +
<head>
 +
<title>フリーサイズオーバーフロー透かし重なり縦スクロールスライドショーギャラリー[IMG][大]No.3243</title>
 +
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />
 +
<script type="text/javascript" charset="Shift_JIS" src="http://www.geocities.jp/miyake_kobo/js/miyake_002.js?temp2_3243"></script>
 +
<script language="JavaScript">
 +
<!--
 +
 +
//--- 書き換える部分↓ ---
 +
 +
var obo=5000; //---スライドショーの速度（ミリ秒単位）
 +
var min=3; //---エフェクト速度
 +
var main_id="SlideGallery"; //---スライドショーギャラリーのID名
 +
 +
//--- 書き換える部分↑ ---
 +
 +
//--Copyright (C) Miyake_kobo.--
 +
//-->
 +
</script>
 +
<style type="text/css">
 +
<!--
 +
div.koboImgDiv table{position:absolute;top:0px;left:0px;width:100%;height:100%;}
 +
div.koboImgDiv img{position:relative;top:0px;left:0px;margin:auto;cursor:pointer;}
 +
div.koboThmDiv img{width:50px;height:50px;cursor:pointer;vertical-align:middle;margin-bottom:5px;}
 +
div.koboButDiv button{width:50px;height:30px;background-color:#fff;border:1px solid #ccc;cursor:pointer;vertical-align:middle;}
 +
div.koboButDiv{position:absolute;bottom:0px;left:0px;z-index:2;width:400px;height:30px;}
 +
span.koboComSpan{margin-left:20px;}
 +
-->
 +
</style>
 +
</head>
 +
<body style="text-align:center;">
 +
 +
<!-- ここからスライドショーギャラリー -->
 +
 +
<table id="SlideGallery" style="position:relative;top:0px;left:0px;margin:auto;font-family:'メイリオ';" cellpadding="0" cellspacing="0">
 +
<tr>
 +
<td style="width:220px;text-align:center;">
 +
 +
<div style="font-size:200px;color:#ccc;font-family:'ＭＳ Ｐ明朝';margin:auto;"><b>風</b></div>
 +
<div style="width:100%;background-color:#689;color:#fff;text-align:center;">Photographs</div>
 +
 +
</td>
 +
<td rowspan="2" style="width:100px;"></td>
 +
<td rowspan="2" style="width:640px;height:740px;">
 +
 +
<!-- スライドショー部分。すべての写真が入る大きさに設定。↓ -->
 +
 +
<div class="koboImgDiv" style="position:relative;top:0px;left:0px;width:640px;height:740px;">
 +
<table cellpadding="0" cellspacing="0">
 +
<tr>
 +
<td style="text-align:center;">
 +
<img galleryimg=no />
 +
</td>
 +
</tr>
 +
</table>
 +
<table cellpadding="0" cellspacing="0">
 +
<tr>
 +
<td style="text-align:center;">
 +
<img galleryimg=no title="next" />
 +
</td>
 +
</tr>
 +
</table>
 +
<div id="copyright">(C) Script by Miyake_kobo.</div>
 +
 +
<!-- コントロール部分 -->
 +
 +
<div class="koboButDiv">
 +
<button>prev</button>
 +
<button>play</button>
 +
<button>next</button>
 +
<span class="koboComSpan">しばらくお待ちください。</span>
 +
</div>
 +
 +
</div>
 +
 +
</td>
 +
</tr>
 +
<tr>
 +
<td style="">
 +
 +
<!-- 一覧部分。サムネイルサイズに合わせて微調節。↓ -->
 +
 +
<div class="koboThmDiv" style="width:220px;">
 +
 +
<!-- ここから写真データ -->
 +
 +
<img src="http://www.geocities.jp/miyake_kobo/DATA30/25.jpg" title="ショウガツザクラ" />
 +
<img src="http://www.geocities.jp/miyake_kobo/cp_ex/11.jpg" title="サザンカ" />
 +
<img src="http://www.geocities.jp/miyake_kobo/cp_ex/1.jpg" title="福寿草" />
 +
<img src="http://www.geocities.jp/miyake_kobo/DATA33/4.jpg" title="ツバキ" />
 +
<img src="http://www.geocities.jp/miyake_kobo/DATA33/14.jpg" title="シラン" />
 +
<img src="http://www.geocities.jp/miyake_kobo/DATA30/10061.jpg" title="ツツジ" />
 +
<img src="http://www.geocities.jp/miyake_kobo/DATA33/15.jpg" title="ハナミズキ" />
 +
<img src="http://www.geocities.jp/miyake_kobo/cp_ex/6.jpg" title="金のなる木" />
 +
<img src="http://www.geocities.jp/miyake_kobo/DATA30/10172.jpg" title="額紫陽花" />
 +
<img src="http://www.geocities.jp/miyake_kobo/DATA33/22.jpg" title="ツワブキ" />
 +
<img src="http://www.geocities.jp/miyake_kobo/DATA33/10.jpg" title="モクレン" />
 +
<img src="http://www.geocities.jp/miyake_kobo/cp_ex/3.jpg" title="スイセン" />
 +
<img src="http://www.geocities.jp/miyake_kobo/DATA30/19.jpg" title="彼岸花" />
 +
<img src="http://www.geocities.jp/miyake_kobo/cp_ex/9.jpg" title="菊" />
 +
<img src="http://www.geocities.jp/miyake_kobo/DATA30/10657.jpg" title="菊" />
 +
<img src="http://www.geocities.jp/miyake_kobo/cp_ex/14.jpg" title="六義園の紅葉" />
 +
<img src="http://www.geocities.jp/miyake_kobo/DATA33/21.jpg" title="梅" />
 +
<img src="http://www.geocities.jp/miyake_kobo/DATA30/10830.jpg" title="落ち葉" />
 +
 +
<!-- ここまで写真データ -->
 +
 +
</div>
 +
 +
</td>
 +
</tr>
 +
</table>
 +
 +
<!-- ここまでスライドショーギャラリー -->
 +
 +
 +
 +
 +
 +
 +
<br />
 +
<br />
 +
<br />
 +
<br />
 +
<br />
 +
 +
 +
<div style="width:960px;margin:auto;text-align:center;font-family:'メイリオ';"> <!---main--->
 +
 +
<h3>フリーサイズオーバーフロー透かし重なり縦スクロールスライドショーギャラリー[IMG][大]No.3243</h3>
 +
 +
<dl style="text-align:left;">
 +
<dt>このページの説明
 +
<dd>
 +
　写真サイズに制限はありませんが、大写真を縮小して小写真に使用しますので、枚数が多くなると重くなります。
 +
また、枠をはみ出してスクロールしますので程々の大きさにしてください。
 +
「play」ボタンでスライドショーが開始され、ボタンは「pause」に変わります。
 +
一覧の小写真をクリックで大写真が切り替わります。
 +
小写真や「next」「prev」ボタンの操作は停止や開始には影響を与えません。
 +
</dl>
 +
 +
<br />
 +
 +
<dl style="width:100%;text-align:left;margin:auto;">
 +
<dt>使用方法
 +
<dd>
 +
　右クリックからこのページのソースを開き、コピーして使用してください。その際、&lt;/html&gt;の後に何がしかのコードが表示された場合は、これを削除して使用してください。ソースの最後は、あくまで&lt;/html&gt;です。
 +
<dd>
 +
　一覧部分はクラス名koboThmDivのdivタグで、写真データはその中にimgタグを単純に並べるだけです。サンプルは絶対パス表記をしていますが、相対パスでも、スライドショーギャラリーと同じホルダーにあればファイル名だけでも、かまいません。
 +
レイアウト変更は自由ですが、ボタンの順番と個数は変えないでください。
 +
HTMLファイルの制作方法は、
 +
<a href="../../home.html?4">サンプル使用上の注意事項</a>
 +
をご参照ください。
 +
<dd>
 +
　このスライドショーは共通プログラムを使用しているため、HEAD内で外部ファイルを読み込んでいますが、この部分は書き換えないでください。なお、共通プログラムを本体内に入れた（外部ファイルを不要にした）ソースを記載したページをご覧になりたい方は、有料版（著作権表記の削除）をお申し込みください。
 +
</dl>
 +
 +
<br />
 +
 +
 +
<br />
 +
<br />
 +
<br />
 +
 +
</div>
 +
 +
</body>

Revision as of 06:51, 26 September 2012

フリーサイズオーバーフロー透かし重なり縦スクロールスライドショーギャラリー[IMG][大]No.3243

風
Photographs
しばらくお待ちください。





フリーサイズオーバーフロー透かし重なり縦スクロールスライドショーギャラリー[IMG][大]No.3243

このページの説明
　写真サイズに制限はありませんが、大写真を縮小して小写真に使用しますので、枚数が多くなると重くなります。 また、枠をはみ出してスクロールしますので程々の大きさにしてください。 「play」ボタンでスライドショーが開始され、ボタンは「pause」に変わります。 一覧の小写真をクリックで大写真が切り替わります。 小写真や「next」「prev」ボタンの操作は停止や開始には影響を与えません。

使用方法
　右クリックからこのページのソースを開き、コピーして使用してください。その際、</html>の後に何がしかのコードが表示された場合は、これを削除して使用してください。ソースの最後は、あくまで</html>です。
　一覧部分はクラス名koboThmDivのdivタグで、写真データはその中にimgタグを単純に並べるだけです。サンプルは絶対パス表記をしていますが、相対パスでも、スライドショーギャラリーと同じホルダーにあればファイル名だけでも、かまいません。 レイアウト変更は自由ですが、ボタンの順番と個数は変えないでください。 HTMLファイルの制作方法は、 サンプル使用上の注意事項 をご参照ください。
　このスライドショーは共通プログラムを使用しているため、HEAD内で外部ファイルを読み込んでいますが、この部分は書き換えないでください。なお、共通プログラムを本体内に入れた（外部ファイルを不要にした）ソースを記載したページをご覧になりたい方は、有料版（著作権表記の削除）をお申し込みください。




Retrieved from "http://2012.igem.org/Team:Tokyo-NoKoGen/Team/Photogalary"