html5应用程序音频不起作用

Question

this code does not seem to work when I test it in the ipad (HTML5 app). 当我在ipad（HTML5应用）中对其进行测试时，该代码似乎无法正常工作。 This works in web browsers though... Do anyone of you have a workaround for this? 不过，这可以在Web浏览器中使用...你们中的任何人是否有解决方法？ I only need to make it work for the iOS devices especially for the iPAD. 我只需要使它适用于iOS设备，尤其是iPAD。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8" />

  <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame 
       Remove this if you use the .htaccess -->
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

  <title>Disc</title>
  <meta name="description" content="" />
  <meta name="viewport" content="width=device-width; initial-scale=1.0" />
  <style>
    img {
        position:relative;
    }
    #cover {
        height:200px;
        width:150px;
        top:150px;
    }
    #disc {
        height:100px;
        width:98px;
        top:100px;
        left:-105px;
        z-index:-1;
        -webkit-transition:all linear 0.5s;
        -webkit-animation:disc 1s linear;
        -webkit-animation-iteration-count:infinite;
    }
    @-webkit-keyframes disc {
        from {-webkit-transform:rotate(0deg);}
        to {-webkit-transform:rotate(360deg);}
    }
  </style>
  <script type="text/javascript">
    function init() {
        var isOpen = false;
        document.getElementById('cover').addEventListener('click',function() {
            if (!isOpen) {
                document.getElementById('disc').style.top = "0px";
                isOpen = true;
                playSound();
            } else {
                document.getElementById('disc').style.top = "100px";
                isOpen = false;
                stopSound();
            }
        });
        function playSound() {
            document.getElementById('music').play();
        }
        function stopSound() {
            document.getElementById('music').pause();
            document.getElementById('music').currentTime = 0;
        }
    }
  </script>
</head>

<body onload="init()">
  <img id="cover" src="the bloomfields/bloomcover.jpg" alt=""/>
  <img id="disc" src="the bloomfields/record.png" alt=""/>
  <audio id="music">
    <source src="07 Its Complicated.mp3" type="audio/mpeg"/>
  </audio>
</body>
</html>

any ideas? 有任何想法吗？ thanks 谢谢

Answer 1

how about you check either your ipad could play mp3 format or not with canPlayType() function from audio element, and also you could add the codecs to your audio source that could be better way to define it. 您如何通过音频元素中的canPlayType()函数检查ipad是否可以播放mp3格式，还可以将编解码器添加到音频源中，这可能是更好的定义方式。 <source src="07 Its Complicated.mp3" type="audio/mpeg"; codecs='mp3'> <source src="07 Its Complicated.mp3" type="audio/mpeg"; codecs='mp3'> . <source src="07 Its Complicated.mp3" type="audio/mpeg"; codecs='mp3'> 。
Then the last, maybe I think your audio source path is not define correctly, "07 Its Complicated.mp3" -> it's contain space characters that the browser could be not render it correctly. 然后是最后一个，也许我认为您的音频源路径定义不正确，“ 07它的Complicated.mp3”->它包含空格字符，浏览器可能无法正确呈现它。

html5应用程序音频不起作用

问题描述

1 个解决方案

解决方案1
0 2012-02-28 01:38:06

html5应用程序音频不起作用

问题描述

1 个解决方案

解决方案1 0 2012-02-28 01:38:06

解决方案1
0 2012-02-28 01:38:06