Блог

Главная - Вопросы по программированию - Обнаружение поддержки звука html5 с помощью Modernizr

Обнаружение поддержки звука html5 с помощью Modernizr

#javascript #html #modernizr

#javascript #HTML #modernizr

Вопрос:

Можно ли определить, поддерживает ли браузер аудио Html5 с помощью Modernizr? Если да, то как это делается? Если нет, есть ли какие-либо обходные пути? В Google мало ресурсов, объясняющих это, поэтому любая помощь будет оценена.

Комментарии:

1. Я собирался опубликовать третий ответ «прочитайте документы», но два других были опубликованы за несколько секунд до этого. Документация должна быть вашим первым ресурсом, а не Stack Overflow…

Ответ №1:

Да, через modernizr.audio. Он поддерживает ряд аудиоформатов (в настоящее время ogg, mp3, m4a и wmv). Пример:

 var audio = new Audio();
audio.src = Modernizr.audio.ogg ? 'background.ogg' :
            Modernizr.audio.mp3 ? 'background.mp3' :
                                  'background.m4a';
audio.play();

Дополнительная информация в документации.

Комментарии:

1. Да, я пробовал это:<script type=»text/javascript»> if (Modernizr.audio){ <?php include(«music.php «); ?> } else { <?php включить(«error.php «); ?> } </script> и это, похоже, неработа.. Я попробую, спасибо, чувак

2. как мне выполнить что-то внутри оператора if?

3. Звук даже не воспроизводится и i55.tinypic.com/2qdbl3k.png на этом изображении у меня не должно быть пометки «} else { error}» в конце.

4. @Michael пожалуйста, разместите полный сгенерированный HTML-код на вставленном сайте (например gist.github.com )

Ответ №2:

Да, Modernizr обнаруживает поддержку звука, согласно документации (это ссылка), которая даже включает пример кода (скопированный ниже):

 var audio = new Audio();
audio.src = Modernizr.audio.ogg ? 'background.ogg' :
            Modernizr.audio.mp3 ? 'background.mp3' :
                                  'background.m4a';
audio.play();

Ответ №3:

Я нашел этот код, и он отлично работал для меня:

 <!DOCTYPE html>
<html>  
<head>
<title>Play Audio</title>
<script src="script/jquery-1.6.2.min.js" type="text/javascript"></script>
<script src="script/modernizr-latest.js" type="text/javascript"></script>
<script type="text/javascript">
var currentFile = "";
function playAudio() {

    var oAudio = document.getElementById('myaudio');
    // See if we already loaded this audio file.
    if ($("#audiofile").val() !== currentFile) {
        oAudio.src = $("#audiofile").val();
        currentFile = $("#audiofile").val();
    }
        var test = $("#myaudio");
        test.src = $("#audiofile").val();
    oAudio.play();   
}

$(function() {
    if (Modernizr.audio) {
        if (Modernizr.audio.wav) {
            $("#audiofile").val("sounds/sample.wav"); 
        }
        if (Modernizr.audio.mp3) {
            $("#audiofile").val("sounds/sample.mp3");
        }
    }
    else {
      $("#HTML5Audio").hide();
      $("#OldSound").html('<embed src="sounds/sample.wav" autostart=false width=1 height=1 id="LegacySound" enablejavascript="true" >');
    }

});
</script>
</head>

<body>
<div style="text-align: center;"> 
 <h1>Click to Play Sound<br /></h1>
<div id="HTML5Audio">
<input id="audiofile" type="text" value="" style="display: none;"/><br />

<button id="play" onclick="playAudio();">
    Play
</button>
</div>
<audio id="myaudio">
    <script>
    function LegacyPlaySound(soundobj) {
      var thissound=document.getElementById(soundobj);
      thissound.Play();
    }
    </script>
    <span id="OldSound"></span>        
    <input type="button" value="Play Sound" onClick="LegacyPlaySound('LegacySound')">
</audio>

Просто добавьте аудио с правильным именем в папку и добавьте файлы modernizer с помощью Jquery, и все готово.

Комментарии:

1. Атрибуция: misfitgeek.com/2011/08 /…

Ответ №4:

Да. http://www.modernizr.com/docs/#installing На полпути вниз.

Метки: