Comment faire jouer un son de notification sur les sites web ?

Question

Lorsqu'un certain événement se produit, je veux que mon site Web émette une courte notification sonore à l'intention de l'utilisateur.

Le son doit pas se lancer automatiquement (instantanément) à l'ouverture du site Web. Au lieu de cela, il doit être lu à la demande via JavaScript (lorsque cet événement précis se produit).

Il est important que cela fonctionne également sur les anciens navigateurs (IE6 et autres).

Donc, en fait, il y a deux questions :

1. Quel codec dois-je utiliser ?
2. Quelle est la meilleure pratique pour intégrer le fichier audio ? ( <embed> vs. <object> vs. Flash vs. <audio> )

Answer 1

Pourquoi pas le lecteur multimédia de Yahoo ? Il suffit d'intégrer la bibliothèque de Yahoo

<script type="text/javascript" src="http://mediaplayer.yahoo.com/js"></script> 

Et l'utiliser comme

<a id="beep" href="song.mp3">Play Song</a>

Pour un démarrage automatique

$(function() { $("#beep").click(); });

Answer 2

si vous voulez appeler un événement sur le code La meilleure façon de le faire est de créer un déclencheur car le navigateur ne répondra pas si l'utilisateur n'est pas sur la page.

<button type="button" style="display:none" id="playSoundBtn" onclick="playSound();"></button>

maintenant vous pouvez déclencher votre bouton quand vous voulez jouer un son

$('#playSoundBtn').trigger('click');

Answer 3

Utilisez le audio.js qui est un polyfill pour le <audio> avec retour au flash.

En général, regardez https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills pour les polyfills des API HTML 5 ( il comprend plus <audio> polyfills )

Answer 4

var audio = new Audio('audio_file.mp3');

function post()
{
  var tval=document.getElementById("mess").value;   
  var inhtml=document.getElementById("chat_div");
  inhtml.innerHTML=inhtml.innerHTML+"<p class='me'>Me:-"+tval+"</p>";
  inhtml.innerHTML=inhtml.innerHTML+"<p class='demo'>Demo:-Hi! how are you</p>";
  audio.play();
}

ce code provient de talkerscode Pour un tutoriel complet, visitez le site suivant http://talkerscode.com/webtricks/play-sound-on-notification-using-javascript-and-php.php

Answer 5

J'ai écrit une méthode fonctionnelle propre pour jouer des sons :

sounds = {
    test : new Audio('/assets/sounds/test.mp3')
};

sound_volume = 0.1;

function playSound(sound) {
    sounds[sound].volume = sound_volume;
    sounds[sound].play();
}
function stopSound(sound) {
    sounds[sound].pause();
}
function setVolume(sound, volume) {
    sounds[sound].volume = volume;
    sound_volume = volume;
}