Главная » Файлы » Прочие скрипты » Яваскрипты |
Звуковые эффекты при наведение мышкой на ссылку
24.06.14, 08:58:47 | |
Привет всем. Этот скрипт поможет вам озвучить любую ссылку. Много описывать не буду в демки все понятно. Дополнительно на официальном сайте. ДЕМО И так приступим к установке: В блоках где мы хотим чтобы воспроизводился клик, между тегами head Ставим скрипт Код <script> // Mouseover/ Click sound effect- by JavaScript Kit (www.javascriptkit.com) // Visit JavaScript Kit at http://www.javascriptkit.com/ for full source code //** Usage: Instantiate script by calling: var uniquevar=createsoundbite("soundfile1", "fallbackfile2", "fallebacksound3", etc) //** Call: uniquevar.playclip() to play sound var html5_audiotypes={ //define list of audio file extensions and their associated audio types. Add to it if your specified audio file isn't on this list: "mp3": "audio/mpeg", "mp4": "audio/mp4", "ogg": "audio/ogg", "wav": "audio/wav" } function createsoundbite(sound){ var html5audio=document.createElement('audio') if (html5audio.canPlayType){ //check support for HTML5 audio for (var i=0; i<arguments.length; i++){ var sourceel=document.createElement('source') sourceel.setAttribute('src', arguments[i]) if (arguments[i].match(/\.(\w+)$/i)) sourceel.setAttribute('type', html5_audiotypes[RegExp.$1]) html5audio.appendChild(sourceel) } html5audio.load() html5audio.playclip=function(){ html5audio.pause() html5audio.currentTime=0 html5audio.play() } return html5audio } else{ return {playclip:function(){throw new Error("Your browser doesn't support HTML5 audio unfortunately")}} } } //Initialize two sound clips with 1 fallback file each: var mouseoversound=createsoundbite("Тут ваш Медео файл whistle.ogg", "Тут ваш Медео файл whistle.mp3") var clicksound=createsoundbite("Тут ваш Медео файл click.ogg", "Тут ваш Медео файл click.mp3") </script> Далее ссылки выглядят так Код <p align="left"> <a href="Ваша ссылка" onmouseover="mouseoversound.playclip()">Название блока1</a></p> <p align="left"> <a href="Ваша ссылка" onmouseover="mouseoversound.playclip()">Название блока2</a></p> <p align="left"> <a href="Ваша ссылка" onmouseover="mouseoversound.playclip()">Название блока3</a></p> <p align="left"> <a href="Ваша ссылка" onmouseover="mouseoversound.playclip()">Название блока3</a></p> <p align="left"><b>Эффект кликов:</b></p> <p align="left"> <a href="Ваша ссылка" onclick="clicksound.playclip()">Название блока 1</a> <a href="Ваша ссылка" onclick="clicksound.playclip()">Название блока 2</a> <a href="Ваша ссылка" onclick="clicksound.playclip()">Название блока3</a></p> Поддержка браузерами звуковые файлы. Firefox 3.5 + Поддерживает. OGG,. WAV IE9 + Поддерживает MP3. Chrome 6 + Поддерживает. OGG,. Mp3,. Mp4 Safari 5 + Поддерживает. Mp3,. Mp4,. WAV Opera 10.5 + Поддерживает. OGG,. WAV Ну вроде и вся установка всем удачи. Материал подготовил: Bizon Источник:http://www.javascriptkit.com | |
Просмотров: 415 | Загрузок: 0 | |
Всего комментариев: 0 | |
| |