Зайцев Я - Добавляем звуки при наведении мыши или клике на меню
^ В верх

Зайцев.Я

Не стесняйтесь звонить даже за советом...


Войти
x
x

Новости

  • 1
  • 2
  • 3
  • 4
  • 5
Prev Next

Материалы по CCNA R&S

15-12-2015 Hits:2114 Новости Александр

Материлы по изучению CCNA Routing and Switching   Cisco Packet Tracer 6.2 for Windows Student Version   Видео материалы: ICND 1ч.   ICND 2ч.   ICND 3ч.   ICND...

Пишем программы для веба

04-12-2015 Hits:13009 Новости Александр

Пишем программы для веба Начиная писать программы для веба, многие начинающие программисты сталкиваются с такой ошибкой. Они рассматривают систему браузер-сервер, как...

Лабораторные работы

30-11-2015 Hits:3668 Новости Александр

 Лабораторные работы CCNA R&S   Теория - конечно очень нужная вещь , но без практики ни чего не запомнишь , ниже ссылки...

Добавляем звуки при наведении мыши или клике на меню

10-11-2015 Hits:11502 Новости Александр

Добавляем звуки при наведении мыши или клике на меню И так - всё просто , звук является частью дизайна и способность...

Обсуждение Virtumart 2

20-02-2015 Hits:3623 Новости Александр

 По моему мнению которое скорей всего субъективно - Virtumart 2 в отношении отображения цен сделан мягко говоря - коряво. И дабы...

www.radiobells.com #radiobells_script_hash
×

Сообщение

PLG_KUNENADISCUSS_DEPENDENCY_FAIL

Сайт можно заказать здесь http://zaycev.me/

Загрузки

Добавляем звуки при наведении мыши или клике на меню

И так - всё просто , звук является частью дизайна и способность проигрывать звуковые ролики. Чтобы проиграть звук при прохождении курсором мыши определённой области нам придется полагаться на HTML5 или Flash. Но кто в наше время захочет связываться с Flash?  Поэтому обратимся к HTML5, который может проигрывать звук с помощью своего элемента <audio> (Firefox 3.5+, Chrome 3+, Opera 10.5+, Safari 4+, IE 9+). Чтобы обеспечить поддержку данной функции как можно большим числом браузеров будем использовать и MP3 источники (WebKit и IE) и OGG (Firefox и Opera).

Открываем index.php → между тегами <header> вставляем вызов процедуры выполнения скрипта:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>

Далее вставляем скрипт в том месте страницы index.php где у нас позиция модуля меню , а точнее сразу за ним перед закрывающим тегом </div>

Заранее измените на свои элементы отмеченные красным и синим цветом, как понятно красным отмечен путь к звуковым файлам ,а синим ID или CLASS модуля меню , его вы можете посмотреть кликнув правой кнопкой мыши по меню и выбрав пункт "Просмотр кода элемента"

<audio id="beep-two" preload="auto"> {
display:none;

}
<source src="/audio/beep.mp3" controls></source>
<source src="/audio/beep.ogg" controls></source>
К сожалению ваш браузер не поддерживает элемент &lt;audio&gt;.
</audio>

<script>$(swmenu)
.each(function(i) {
if (i != 0) { 
$("#beep-two")
.clone()
.attr("id", "beep-two" + i)
.appendTo($(this).parent()); 
}
$(this).data("beeper", i);
})
.click(function() {
$("#beep-two" + $(this).data("beeper"))[0].play();
});
$("#beep-two").attr("id", "beep-two0");</script>

ВАЖНО ПРАВИЛЬНО ОПРЕДЕЛИТЬ МЕСТО, КУДА ВСТАВИТЬ ЭТОТ КОД!

Заливаем звуковые файлы по FTP на Ваш сайт и проверяем что получилось.

В данном примере звук будет проигрываться при нажатии на пункт меню , если хотите слышать звуки при наведении на пункт меню ,то меняем .click(function() на .mouseenter(function()

Рабочий вариант (как демо-пример) находиться на этом сайте... По счелкайте по главному меню. Успехов!!!

 Кому понравился звук перелистывания страниц с моего сайта, скачать его можно тут. Выберете "Сохранить как"