| |
今回は右側にサムネイル写真を表示し､左側に拡大写真を表示する､
ホームページ道具箱のスライドショーの勉強です。
昨年1月に第7回HP勉強会で使用したtm_photoは、写真の自動切り替えができません
でしたが､今回のツールは自動切り替えができてBGMができないtm_slideにBGMの機能
を追加しました。
2014/03 三宅
---------------------------------------------------------------------------------------------------
|
| １ |
事前準備:
①640×480ピクセルの写真を16枚準備する。
②同じ写真で76×57ピクセルに縮小したものも同じく16枚準備する。
③BGM用のMIDIファイルも下記サイトから入手しておく事。
日本の童謡･唱歌 世界の民謡･名歌
↓ |
| ２ |
下の図のようにMy-HPのフォルダー内にslide4というフォルダーを作る。
更にその中にphotoというフォルダーを作り、上記の①、②の写真をその中に入れる。
写真の名前は大きい方が01.jpg～16.jpgで小さい方は01s.jpg～16s.jpgにする。
↓ |
| ３ |
下記２つのファイルを｢右クリック｣で｢対象をファイルに保存｣でslide4内に保存する。
slide4.html、tm_slide4.js
上記③の音楽ファイルもslide4のフォルダーに入れる。
上記のslide4.htmlをクリックすればサンプルが動作します。
『Slide⇒⇒』をクリックするとスライドショーになり、『Bgm♪』をクリックするとBGMが鳴ります。
このスライドショーのBGMではbgm_button.jsは必要有りません。音楽ファイルのみを準備願います。
↓ |
| ４ |
slide4.htmlをTeraPadで開き、写真のコメントなどを編集します。
音楽ファイル名なども編集します
この操作は、勉強会当日に説明致します。
↓ |
| ５ |
今回もトップページへとトップページからのリンクを繋ぎ直しします。
自分でフォルダーのレベルを意識してリンクを実施します。 |
