平成30/ 2018-10-21 05:32
html/ カーソル 音 再生

HTML5のaudio タグで、IE8を切り捨ててもいいかもしれない。
http://www.htmq.com/html5/audio.shtml

タグは、object, bgsound, embed で再生できるが、bgsoundはIEでしか再生できず、objectだとIEで再生できない。
なので、embed を使った。また、srcにファイル名を代入すると、onMouseOverで再生できないプラウザがあったので、innerHTMLでタグごと代入している。

IE9, Firefox, Safari, chrome で動作検証済み。

<head>
<script style="text/javascript">
function soundOn(name){
document.getElementById('sound').innerHTML='<embed src=\''+name+'\' id=\'sound\' hidden=\'true\' autostart=\'true\' type=\'audio/mpeg\' width=\'0\' height=\'0\' />';
}
</script>
</head>

<body>
<div id="sound"></div>

<a href="archive" onMouseOver="soundOn('/sound/do.mp3');
"><img src="<?php bloginfo('template_url'); ?>/images/gmenu_01_off.png" alt="" width="138" height="277" /></a>
<a href="googlecalendar" onMouseOver="soundOn('/sound/re.mp3');
"><img src="<?php bloginfo('template_url'); ?>/images/gmenu_02_off.png" alt="" width="136" height="277" /></a>
<a href="#" onMouseOver="soundOn('/sound/mi.mp3');
"><img src="<?php bloginfo('template_url'); ?>/images/gmenu_03_off.png" alt="" width="136" height="277" /></a>
</body>


>> 上記だと、ChromeでQuicktimeプラグインの警告がでるらしい。原因はMP3。その場合、WAVファイルにすればいいらしい。その場合は
<head>
<script style="text/javascript">
function soundOn(name){
document.getElementById('sound').innerHTML='<embed src=\''+name+'\' id=\'sound\' hidden=\'true\' autostart=\'true\' type=\'audio/x-wav\' width=\'0\' height=\'0\' />';
}
</script>
</head>
<body>
<div id="sound"></div>
<ul class="clearfix">
<li><a href="archive" onMouseOver="soundOn('/sound/do.wav');
"><img src="<?php bloginfo('template_url'); ?>/images/gmenu_01_off.png" alt="" width="138" height="277" /></a></li>
<li><a href="googlecalendar" onMouseOver="soundOn('/sound/re.wav');
"><img src="<?php bloginfo('template_url'); ?>/images/gmenu_02_off.png" alt="" width="136" height="277" /></a></li>
</ul>
</body>

でも、以下URL見て検証してみると更にいいかも。
以下は、Objectタグの使い方が分かる。
http://www.tagindex.com/html_tag/other/object.html

以下は、Flashプラグインを使えばいい的なもの。
http://productforums.google.com/forum/#!category-topic/chrome-ja/%E5%88%A9%E7%94%A8%E6%96%B9%E6%B3%95%E3%81%AB%E9%96%A2%E3%81%99%E3%82%8B%E8%B3%AA%E5%95%8F/GGhO9ThAzMI

//<<

( Thanks. )
Home HTMLタグ 埋め込みタグ 様々な形式のデータを埋め込む
http://www.tagindex.com/html_tag/other/object.html

Google chromeでWindows Media Player をプラグインしたいが、Quick Timerがプラグインされる
http://productforums.google.com/forum/#!category-topic/chrome-ja/%E5%88%A9%E7%94%A8%E6%96%B9%E6%B3%95%E3%81%AB%E9%96%A2%E3%81%99%E3%82%8B%E8%B3%AA%E5%95%8F/GGhO9ThAzMI

<audio> …… 音声を再生する
http://www.htmq.com/html5/audio.shtml