वेबसाइटों पर अधिसूचना ध्वनि कैसे खेलें?

जब कोई निश्चित घटना होती है, तो मैं चाहता हूं कि मेरी वेबसाइट उपयोगकर्ता को एक छोटी अधिसूचना ध्वनि बजाए।वेबसाइटों पर अधिसूचना ध्वनि कैसे खेलें?

ध्वनि वेबसाइट खोलने पर ऑटो-स्टार्ट (तत्काल) नहीं होना चाहिए। इसके बजाय, इसे जावास्क्रिप्ट के माध्यम से मांग पर खेला जाना चाहिए (जब वह निश्चित घटना होती है)।

यह महत्वपूर्ण है कि यह पुराने ब्राउज़र (आईई 6 और ऐसे) पर भी काम करता है।

मैं क्या कोडेक का उपयोग करना चाहिए:

तो, मूल रूप से दो सवाल कर रहे हैं?
ऑडियो फ़ाइल को एम्बेड करने का सबसे अच्छा अभ्यास क्या है? (<embed> बनाम <object> बनाम फ्लैश बनाम <audio>)

स्रोत

2012-04-11 Timo

डाउनवॉटर ने यह बताने की देखभाल की कि मेरे प्रश्न में क्या गलत है? – Timo

मैं एक बहुत ही सुरुचिपूर्ण समाधान है कि काफी सभी ब्राउज़रों पर काम करता है पाया (इसे और अधिक <audio> polyfills भी शामिल है) (यहां तक कि फ़्लैश स्थापित बिना HTML के लिए polyfills के लिए https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills को देखो)।

मैंने क्रोम, सफारी, फ़ायरफ़ॉक्स, ओपेरा और आईई 6 पर परीक्षण किया।

यह पुराने ब्राउज़र के लिए नए ब्राउज़र और <embed> टैग निवर्तन के लिए एचटीएमएल 5 <audio> टैग का एक मिश्रण है:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 

<html> 

    <head> 
     <title>Audio test</title> 

     <script type="text/javascript"> 
      /** 
      * @param {string} filename The name of the file WITHOUT ending 
      */ 
      function playSound(filename){ 
       document.getElementById("sound").innerHTML='<audio autoplay="autoplay"><source src="' + filename + '.mp3" type="audio/mpeg" /><source src="' + filename + '.ogg" type="audio/ogg" /><embed hidden="true" autostart="true" loop="false" src="' + filename +'.mp3" /></audio>'; 
      } 

     </script> 
    </head> 

    <body> 

     <!-- Will try to play bing.mp3 or bing.ogg (depends on browser compatibility) --> 
     <button onclick="playSound('bing');">Play</button> 
     <div id="sound"></div> 

    </body> 
</html>

कोडेक के रूप में मैं क्रोम, सफारी और IE के लिए एमपी 3 का उपयोग करें। फ़ायरफ़ॉक्स और ओपेरा के लिए मैंने ओजीजी का उपयोग किया।

स्रोत

2012-04-11 13:56:18 Timo

अच्छा जवाब। इस मामले में हालांकि जब पृष्ठ खोला जाता है तो ध्वनि तुरन्त खेलता है - लेकिन मुझे लगता है कि आप प्रदर्शन उद्देश्यों के लिए कैसे दिखाते हैं। – Stefan

@Stefan यह सही है लेकिन भ्रमित हो सकता है। मैं इसे अपने उत्तर से हटा दूंगा। संकेत के लिए धन्यवाद। – Timo

बिल्कुल सही उत्तर ब्रो ............ बहुत अच्छा काम करता है .......धन्यवाद @valmar –

उपयोग audio.js जो वापस आने फ़्लैश साथ <audio> टैग के लिए एक polyfill है।

सामान्य तौर पर, 5 एपीआई ..

स्रोत

2012-04-11 11:58:43

एमएच, यह फ़्लैश के बिना आईई 6 पर काम नहीं करेगा। – Timo

आह .. क्षमा करें .. समझ में नहीं आया कि आप एक देशी समाधान चाहते थे .. –

कैसे याहू के मीडिया के बारे में खिलाड़ी बस याहू के पुस्तकालय एम्बेड

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

और

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

की तरह उपयोग

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

स्रोत

2012-04-11 15:49:59 Starx

यह भी एक अच्छा समाधान है, लेकिन क्या उस लिंक को छिपाना संभव होगा? मुझे लगता है कि अगर आप इसके लिए 'डिस्प्ले: कोई नहीं' सेट करते हैं, तो यह अब ध्वनि नहीं चलाएगा। इसके अलावा, याहू मीडिया लाइब्रेरी लिंक के बाईं ओर एक छोटा "प्ले" आइकन दिखाता है .. – Timo

@valmar: 'visiblity: छुपा; 'आपका उत्तर – Starx

एक और प्लगइन autostart करने के लिए सूचना ध्वनियों को खेलने के लिए, वेबसाइटों पर: Ion.Sound

लाभ:

HTML5 ऑडियो करने के लिए वापस आने के साथ वेब ऑडियो API के आधार पर लगता है खेलने के लिए जावास्क्रिप्ट प्लगइन।
प्लगइन सबसे लोकप्रिय डेस्कटॉप और मोबाइल ब्राउज़र पर काम कर रहा है और सामान्य वेब साइटों से लेकर ब्राउज़र गेम तक हर जगह इसका उपयोग किया जा सकता है।
ऑडियो-स्प्राइट्स समर्थन शामिल थे।
कोई निर्भरता नहीं (jQuery आवश्यक नहीं है)।
25 मुफ्त ध्वनियां शामिल हैं।

सेट करें प्लगइन:

// set up config 
ion.sound({ 
    sounds: [ 
     { 
      name: "my_cool_sound" 
     }, 
     { 
      name: "notify_sound", 
      volume: 0.2 
     }, 
     { 
      name: "alert_sound", 
      volume: 0.3, 
      preload: false 
     } 
    ], 
    volume: 0.5, 
    path: "sounds/", 
    preload: true 
}); 

// And play sound! 
ion.sound.play("my_cool_sound");

स्रोत

2014-06-16 23:59:54

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(); 
}

इस कोड @Tim द्वारा सलाह दी के रूप में http://talkerscode.com/webtricks/play-sound-on-notification-using-javascript-and-php.php

स्रोत

2016-02-25 11:17:06 ramancha

प्ले पार ब्राउज़र संगत सूचनाएं

talkerscode से पूरा ट्यूटोरियल यात्रा के लिए है this पोस्ट से Tisdall, जांचें Howler.js प्लगइन।

क्रोम जैसे ब्राउज़र javascript निष्पादन निष्पादन करते हैं जब performance सुधारों के लिए न्यूनतम या निष्क्रिय। लेकिन यह अधिसूचना बजाता है भले ही ब्राउज़र निष्क्रिय है या उपयोगकर्ता द्वारा कम किया गया हो।

var sound =new Howl({ 
        src: ['../sounds/rings.mp3','../sounds/rings.wav','../sounds/rings.ogg', 
          '../sounds/rings.aiff'], 
        autoplay: true, 
        loop: true 
        }); 

       sound.play();

आशा किसी की मदद करता है।

स्रोत

2016-07-25 15:20:36 stom

" यह ब्राउज़र अधिसूचना या कम से कम होने पर भी सूचना अधिसूचना बजाता है "? अगर पृष्ठ सो जाता है तो आवाज बज सकती है, लेकिन कोड जो 'sound.play()' को पहली जगह पर चलाता है? क्या हाउलर आपके सभी सेटटाइम को एक रैपर में डालता है? – poshest

@ सबसे ज्यादा, मुझे नहीं पता कि यह कैसे खेलता है, स्रोत कोड की जांच कर रहा है या प्लगइन के लेखक से संपर्क कर सकता है आपकी मदद कर सकता है। – stom

ठीक है, धन्यवाद।यह सिर्फ इतना है कि आपने इस सुविधा का उल्लेख किया है और उस अन्य स्टैक ओवरफ्लो उत्तर से जुड़ा हुआ है, लेकिन इसे [हाउलर दस्तावेज़] (https://github.com/goldfire/howler.js/) में एक विशेषता के रूप में नहीं बताया गया है, इसलिए मैंने सोचा कि आपको कुछ पता था इसके बारे में विशेष। – poshest

2016 के रूप में, निम्नलिखित पर्याप्त होगा (आप भी एम्बेड करने के लिए की जरूरत नहीं है):

var audio = new Audio('/path/to/audio/file.mp3'); 
audio.play();

अधिक here देखें।

स्रोत

2016-09-02 06:50:02 weltschmerz

वेबसाइटों पर अधिसूचना ध्वनि कैसे खेलें?

उत्तर

संबंधित मुद्दे