ブログで音楽を流す方法
このブログのサイドバー（右上）に設置している複数曲プレイヤー設置のやり方です。
※過去に別のスクリプトを公開していましたが、IEブラウザの更新によりエラーが出てしまうようになったので、風柳さんの素晴らしいスクリプトを紹介したいと思います。もうほとんど丸写し状態です（ちょこっと自分仕様＾＾；）
※変更点：
・セレクトボックス内の演奏停止ボタンなし
・はに丸BGM３曲仕様！（もちろん変更可能）
■設置タグ
<script type="text/javascript" src="http://furyu.tea-nifty.com/script/bgmChange.js"></script><div id="bgmControlWindow" class="bgmControlWindow"></div>↑赤字を流したい曲のURL・タイトルに変更して使ってください。
<form name="bgmSelectForm" class="bgmSelectForm" action="javascript:bgmChange()">
<select class="bgmSelected" name="bgmSelected">
<!-- 0 --><option value="" selected>♪選曲♪</option>
<!-- 1 --><option value="http://utauouji2.up.seesaa.net/image/hanimaru_pedaru.wma">ペダル</option>
<!-- 2 --><option value="http://utauouji.up.seesaa.net/image/gakkou.wma">学校の唄</option>
<!-- 3 --><option value="http://utauouji.up.seesaa.net/image/hoshi-1.wma">星降る夜</option>
</select>
<input class="bgmChangeButton" onclick="javascript:bgmChange()" type="button" value="BGM切替" />
</form>
music by <a href="http://utauouji.seesaa.net/" target="_blank">Hanimaru</a>
<script type="text/javascript">
<!--
//* 初期BGM選択
defaultBGM = 0 ; // <form>～</form>内 <!-- X --> の X 指定(0は再生しない)
//* プレイヤー設定
bgmControlOptions = 'width="148" height="40" panel="1" ShowPositionControls="0" ShowControls="1" ShowAudioControls="1" autostart="true" repeat="true" loop="true"' ;
bgmControlOptSelect = {
'blog-tunes' : 'quality="autohigh" width="100" height="100" wmode="transparent"'
, '種別' : 'オプション'
} ;
noBgmControlText = 'Select BGM' ; // BGMが選択されていないときの代替表示
bgmChange() ;
//-->
</script>
<!-- 番号 --><option value="曲URL">タイトル</option>
を<select>タグ内に追加すれば曲数を増やせます。
◇CSS設定
<style type="text/css">◇特定の曲を選択したときだけプレイヤ表示を消したい場合
/* _/_/_/ プレイヤー表示設定 _/_/_/ */
.bgmControl { /* BGMが選択されているとき */
/* width: 148px; height: 40px; */
margin: 0px; padding: 0px;
}
.noBgmControl { /* BGMが選択されていないとき */
width: 48px;
margin: 0px; padding: 0px;
text-align: left;
color: #66CC00;
font-size: 16px; line-height: 18px;
font-weight: bolder;
}
/* _/_/_/ セレクトボックス表示設定 _/_/_/ */
.bgmSelectForm {
margin: 4px 0px 12px 0px; padding: 0px;
}
.bgmSelected {
color: #662200;
background-color: #FFEECC;
}
.bgmChangeButton {
border-style: solid;
border-color: #66CC00;
color: #662200;
background-color: #FFCCEE;
}
</style>
風柳さんのサイトを参考になさってください。＾＾
注意点・ブログによっては「改行を<br/>タグに変換する設定」機能が備わっています。コピペして貼る場合は、この機能はオフにしておいてください。
・同ページに１つ以上のプレイヤー設置はうまく動作しません。（複数設置は風柳さんのサイトにて解説されてます）
自分の好きな曲を流す方法音楽ファイルをアップロードする方法（ウェブスペース）にて多少の説明をしているので、よく分からない人は読んでください。
スペシャルサンクス＾＾*
風柳亭 - 別館：書庫のある庵 -
パチンコ・スロット
