Я так попробовал. получилось. Сделал звук на кнопки главного меню. самый нижний блок у меня не заработал. Вставил код из первого блока.
Делал так:
в <header>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
</header>
<section id="one"><div class="inside">
<div class="main_menu">
<jdoc:include type="modules" name="mainmenu"/>
</div>
<audio id="switch-1" controls="controls" preload="auto">
<source src="templates/rsmetro/audio/switch-1.mp3"></source>
<source src="templates/rsmetro/audio/switch-1.ogg"></source>
</audio>
<script>var beepOne = $("#switch-1")[0];
$(".main_menu")
.click(function() {
beepOne.play();
});</script>
</div></section>
папку со звуками audio создал в моем шаблоне rsmetro и загрузил туда звуки. главное меню соответственно находится в позиции mainmenu.
в моем примере я сделал звук при нажатии на кнопку меню. вставил вместо
это
скрыл полосу проигрывателя
#switch-1, #switch-2, #switch-3, #switch-4 {
display:none;
}
очень долго искал вариант звука для кнопки.
Можно поставить для каждой кнопки свой звук по item пункта меню. если ставите этот скрипт несколько раз, меняйте в новом скрипте beepOne на любое другое значение.
Пример разных звуков для разных кнопок и стилей:
<audio id="switch-4" controls="controls" preload="auto">
<source src="templates/rsmetro/audio/switch-4.mp3"></source>
<source src="templates/rsmetro/audio/switch-4.ogg"></source>
</audio>
<script>var beepFhree = $("#switch-4")[0];
$(".item-131 a, .item-127 a")
.click(function() {
beepFhree.pause();
beepFhree.play();
});</script>
<audio id="Lang" controls="controls" preload="auto">
<source src="templates/rsmetro/audio/button_EN_RU.mp3"></source>
<source src="templates/rsmetro/audio/button_EN_RU.ogg"></source>
</audio>
<script>var beepLang = $("#Lang")[0];
$(".mod-languages")
.click(function() {
beepLang.pause();
beepLang.play();
});</script>