| ポイント |
<![CDATA[
if (document.all) mySND.src = sndName;
<bgsound src="silent.aif" id="mySND">
<a href="javascript:playSound('kin.aif');jumpURL('http://www.yahoo.co.jp/',1000)"
onMouseover="playSound('ring.aif')"
>
]]>
|
| 説 明 |
ロールオーバーでサウンドを鳴らすにはBGSOUNDタグを使い、id属性で名前/IDを指定しておきます。タグで指定する際にsrcでサウンドファイルを指定しますが、読み込み時にサウンドが演奏されると困るので無音のファイルを用意しsrcで指定しておきます。このタグのsrcにロールオーバー時に鳴らしたいサウンドファイル名を入れます。マウスオーバー時には問題になりませんが、クリック時には演奏が完了する前に次のページにジャンプしてしまうとサウンドが途中で途切れてしまいます。また、この状態で前のページに戻ると続きが演奏されてしまいます。これを防ぐために、クリックサウンドが演奏終了したらジャンプするようにします。これはクリックしたらタイマーを使い演奏時間の分だけ待つようにします。setTimeoutを使えば指定時間後に処理を実行できるので、これで指定ページにジャンプさせるようにします。 |
| サンプル |
<![CDATA[
<html>
<head>
<title>ロールオーバーでサウンドを鳴らす</title>
<script language="JavaScript"><!--
function playSound(sndName)
{
if (document.all) mySND.src = sndName;
}
function jumpURL(jpURL,sndTime)
{
setTimeout("location.href='"+jpURL+"'",sndTime);
}
// --></script>
<bgsound src="silent.aif" id="mySND">
</head>
<body>
<a href="javascript:playSound('kin.aif');jumpURL('http://www.yahoo.co.jp/',1000)"
onMouseover="playSound('ring.aif')"
>
<img src="button1.gif" border="0">
</a>
</body>
</html>
]]>
|
| 補足説明 |
サウンドファイルのサイズが大きい場合には読み込みまでの時間がかかりサウンドが再生されない場合があります。サウンドの形式はaiff,au,wavにします。mp3などは指定しないでください。期待通り動作しなくなります。 |
|
■サンプルスクリプトを実行する >>実行
■各ブラウザでの動作結果を見る >>View!
|
ロールオーバーでサウンドを鳴らす