Звуковые эффекты при наведение мышкой на ссылку

Привет всем. 
Этот скрипт поможет вам озвучить любую ссылку.
Много описывать не буду в демки все понятно.

Демка внутри архива!!!

И так приступим к установке:
В блоках где мы хотим чтобы воспроизводился клик, между тегами и
Ставим скрипт

Code
<script> 
  var html5_audiotypes={
  "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")}}  
  }  
  }  

  var mouseoversound=createsoundbite("Тут ваш Медео файл whistle.ogg", "Тут ваш Медео файл whistle.mp3")  
  var clicksound=createsoundbite("Тут ваш Медео файл click.ogg", "Тут ваш Медео файл click.mp3")  

  </script>  
   


Далее ссылки выглядят так

Code
<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

Ну вроде и вся установка всем удачи.

  • FalleN

  • 1453

  • 1

  • 220

Ссылки на статью:

Похожие статьи: