パソコン三昧　やさしい講座　～第45回 SWF・FLV・MP3形式のファイルをHTMLに組み込む手順～

SWF・FLV・MP3形式のファイルをHTMLに組み込む手順

　SWF形式やFLV形式の動画フィルをHTMLに組み込む手順を忘備録として記述する。

SWF形式フィルをHTMLに組み込む手順

　下記、<OBJECT>タグをHTMLに書き込む。
<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/
swflash.cab#version=5,0,0,0" width="600" height="450">
<PARAM name="movie" value="image/tyou.swf">
<PARAM NAME=quality VALUE="high">
<PARAM NAME=wmode VALUE="opaque">
<PARAM NAME=bgcolor VALUE="#e6e7ff">
<embed src="image/tyou.swf" quality="high" wmode="opaque" bgcolor="#e6e7ff" width="600" height="450" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=
ShockwaveFlash">
</OBJECT>

上記の内容はよく理解していませんが、赤字のところがSWF形式のファイルの場所を指します。青字は縦横の大きさを指します。桃字は、背景色です。画面の大きさや背景色は変更ができます。
　下の画像は、上記の内容で記述したものです。
　　　　　　　　　 　　　　　　　　　top へ

FLV形式フィルをHTMLに組み込む手順

　FLV形式ファイルをHTMLに組み込むとき、再生ボタンも追加する手順を記述する。
用意するもの
  1. 動画表示するFLV形式ファイル(tyou.flv)
  2. 再生ボタンを表示する画像ファイル(tyou.png)
  3. FLV形式ファイルを再生するプレイヤー
    「player_flv_maxi.swf」ファイル をダウンロードする。
    1)下記URLをクリックする。
    http://flv-player.net/players/maxi/download/
    2)開いた画面で、「player flv maxi.swf」を右クリックする(①)。開いたメニューから「対象ファイルを保存」をクリックして、 「htmlファイル」と同じフォルダーに保存する(②)。
  4. 設定ファイル（txt ファイル）
    　txtファイルの中は、下記の通りです。
    　flv=tyou.flv --再生する動画ファイル名
    　startimage=tyou.jpg
    　 -スタート時の画像：Preview画像
    　autoplay=0 --自動再生　0:しない / 1:する
    　volume=10 --音量
    　showstop=1
    　 -ストップボタン表示　0:しない / 1:する
    　showvolume=1
    　 -音量調整バー表示　0:しない / 1:する
    　showtime=1 --時間表示　0:しない / 1:する
    　showiconplay=1
    　 -画面上の再生アイコン表示　0:しない / 1:する
　上記の１～４の４つのファイルは、このページ自信のHTMLファイル（動画を埋め込む html ファイル）と同一フォルダーに置きます。ここでは、「kohza45」フォルダーに保存しました。
下記<OBJECT>タグをHTMLに組み込む。
<object type="application/x-shockwave-flash" data="player_flv_maxi.swf" width="600" height="450">
<param name="movie" value="player_flv_maxi.swf">
<param name="FlashVars" value="config=tyou.txt">
</object>
　赤字は、埋め込み型レイヤーで、MP4形式の動画も再生できるそうです。桃字は、画面の大きさを指定します。
　青字は、texitファイル（設定ファイル）を指します。
下の画面の「▶」ボタンをクリックすると、再生します。

　FLV形式ファイルをHTMLに組み込むは、[WASABI]サイトを参照しました。
　　　　　　　　　 　　　　　　　　　top へ

MP3形式フィルをHTMLに組み込む手順

　MP3形式ファイルをHTMLに組み込むとき、再生ボタンも追加する手順を記述する。
用意するもの
  1. 再生するMP3形式ファイル(usagi.mp3)
  2. MP3形式ファイルを再生するプレイヤー
    player_mp3_maxi.swf」ファイル をダウンロードする。(埋め込み型プレイヤー）
    1) 下記URLをクリックする。
    http://flash-mp3-player.net/players/maxi/download/
    2) 開いた画面で、「player mp3 maxi.swf」を右クリックする(①)。開いたメニューから「対象ファイルを保存」をクリックして、 「htmlファイル」と同じフォルダーに保存する(②)。
  3. 設定ファイル（txt ファイル）
    4. 　txtファイルの中は、下記の通りです。
    　　mp3=usagi.mp3 ----再生する音楽ファイル名
    　　autoplay=0 ---自動再生　0:しない / 1:する
    　　loop=0 ---ループ再生　0:しない / 1:する
    　　volume=50 ---音量
    　　showstop=1
    　　 --ストップボタン表示　0:しない / 1:する
    　　showvolume=1
    　　 --音量調整バー表示　0:しない / 1:する
　上記の１～３の３つのファイルは、このページ自信のHTMLファイル（音楽を埋め込む html ファイル）と同一フォルダーに置きます。ここでは、「kohza45」フォルダーに保存しました。

下記<OBJECT>タグをHTMLに組み込む。
<object type="application/x-shockwave-flash" data="player_mp3_maxi.swf" width="200" height="20">
< param name="movie" value="player_mp3_maxi.swf">
< param name="FlashVars" value="config=usagi.txt">
< /object>
　赤字は、埋め込み型レイヤーで、MP4形式の動画も再生できるそうです。
　青字は、texitファイル（設定ファイル）を指します。
桃字は、画面の大きさを指定しますが、変更ができないようです。

　下の画像の「▷」ボタンをクリックしてください。音楽が再生されます。


　MP3形式ファイルをHTMLに組み込むは、[WASABI]サイトを参照しました。
　　　　　　　　　 　　　　　　　　　top へ
　　2017.2.1作
inserted by FC2 system