我想显示html 5音频元素的当前时间和该元素的持续时间.我一直在寻找互联网,但找不到一个功能脚本,它允许我显示音频文件的长度和目前的时间,例如1:35/3:20.
任何人有任何想法:)？
我想知道是否可以设置音频标签的宽度.默认情况下,它不是受支持的功能,因此"hacks"将被愉快地接受.
我已经尝试过将它们放在小桌子和桌子上,但这看起来并不是很顺利......据我所见,我是唯一一个为此烦恼的人,但我真的很感激一些帮助
不需要跨平台/浏览器支持; 只要FireFox(3.6 ++)支持它我就开心了.
关于我将要使用的快速示例:
<audio preload="auto" id="id12" controls="controls" onended="func12();" src="http://192.168.1.68/mymusic.wav"></audio>
我觉得我在这里服用疯狂的药片,因为我无法弄清楚如何使用自定义控件呈现html 5音频标签.
到目前为止我有这个HTML,它没有问题:
<audio controls preload='none'><source src='the url to the audio' type='audio/wav' /></audio>
如何让它只显示播放按钮,也许在播放时,在其中显示暂停按钮.
从我读到的,
默认情况下,该元素不会公开任何类型的播放器控件.您可以使用普通的HTML,CSS和JavaScript创建自己的控件.该元素具有play()和pause()等方法以及名为currentTime的读/写属性.还有读/写音量和静音属性.所以你真的拥有构建自己的界面所需的一切.
如果您不想构建自己的界面,可以告诉浏览器显示一组内置控件.为此,只需在标记中包含controls属性即可.
但我找不到任何使用自定义控件的示例.你怎么得到播放按钮？
我只找到了另一个解决方案,但它不完整,所以我需要帮助.
我有音频设置:
<audio id="player" controls="controls">
<source id="ogg_src" src="lib/audio/barger01.ogg" type="audio/ogg" />
<source id="mp3_src" src="lib/audio/barger01.mp3" type="audio/mp3" />
Your browser does not support the audio element.
</audio>
我有一个动态生成的链接表来更改轨道:
<div id="audio_list">
<a href="#" class="track" data-location="http://www.newoggtrack.ogg">sample</a>
</div>
我有这个jquery,我不知道如何改变轨道
$('.track').click(function(){
load_track = $(this).attr('data-location');//gets me the url of the new track
change_track(load_track);// function to change the track of the loaded audio player without page refresh preferred...
});
我找到了这个功能,但我没有以正确的方式使用它
function change_track(sourceUrl) {
audio.empty();
$("#ogg_src").attr("src", sourceUrl).appendTo(audio);
/****************/
audio[0].pause();
audio[0].load();//suspends and restores all audio element
/****************/
}
audio = $("<audio>").attr("id", …美好的一天,
我的应用是一个音乐播放应用程序.我<audio>用Javascript 控制-Tag.到目前为止没有任何问题,播放,暂停,下一个和上一个按钮正在工作.当我在iOS 5中待机时,音乐会继续播放,但自动下一首歌不起作用.当它不处于待机状态时,它可以工作.在iOS 6中,只需按下按钮,音乐就会淡出.
锁定屏幕上的播放/暂停按钮适用于iOS 5,但不适用于iOS 6.
我正在尝试使用HTML5音频创建一个简单的循环功能,并有一个非常原始的解决方案如下:
$(audio).bind('timeupdate', function() {
if (audio.currentTime >= 26){
var blah = audio.currentTime;
audio.currentTime = 23;
console.log(blah);
}
})
这工作正常,但这里唯一的故障是timeupdate事件不会非常一致地触发.例如,上面的console.log返回:26.14031982421875
26.229642868041992
26.13462257385254
26.21796226501465
...等等.(你得到的想法......不一致的时间)
显然,这对于时序很重要的应用程序(音乐应用程序)不起作用.所以对我来说显而易见的解决方案是增加触发timeupdate事件的粒度.我还没能找到任何API文档...但是很想知道是否有办法做到这一点.
Web Audio API有一个分析器节点,允许您在正在使用的音频上获取FFT数据,并具有获取数据的字节和浮点数.字节版本有点意义,返回看起来像标准化(取决于最小和最大分贝值)强度频谱,其中0不是特定频率仓的音频分量而255是最大值.
但是我想要比8位更多的细节,但使用float版本会产生奇怪的结果.
freqData = new Float32Array(analyser.frequencyBinCount);
analyser.getFloatFrequencyData(freqData);
这给了我介于-891.048828125和0. -891之间的值对应于静音,因此它在某种程度上是最小值,而我猜0是等于最大值.
这是怎么回事？为什么-891.048828125显着？为什么一个大的负面是沉默,零是最大的？我使用错误的FloatArray还是存在配置错误？Float64给出0值.
这就是"存储"声音的方式:
<audio id = "hammer" src="res/sounds/Building/hammer.wav"></audio>
在实际游戏中(我使用声音),我用它来播放声音:
function playSound(soundid)
{
document.getElementById(soundid).currentTime = 0;
document.getElementById(soundid).play();
}
但声音只是第一次播放,而且永远不会再播放!我尝试将控制台中的"currentTime"重置为0,但我确实得到了这个:
>document.getElementById("hammer").currentTime = 0
0
>document.getElementById("hammer").currentTime
0.340...
为什么会发生这种情况,我该如何解决？
我正在尝试使用track标签添加语音音频文件的文本转录.视频标记的默认行为是显示它们(有效).默认情况下,音频标签似乎缺少某种"画布"(即使没有视频也会显示视频标签的黑色区域)以自动显示字幕.我可以使用视频标签,但它会感觉像一个丑陋的解决方法.我不想破坏我的代码的语义.
是否有某种CSS强制显示这些区域将显示subtile？
<audio controls>
<source src="test.ogg" type="audio/ogg">
<source src="test.mp3" type="audio/mpeg">
<track kind="subtitles" label="English subtitles" src="/test.vtt" srclang="en" default></track>
Your browser does not support the audio tag.
</audio>
谢谢你的阅读.
我有以下html页面,我正在尝试展示一个类,用于演示本地存储的mp3音频可视化器:
<!doctype html>
<html>
<head>
<header name = "Access-Control-Allow-Origin" value = "*" />
<style type = "text/css">
div#mp3_player{ width: 500px; height: 60px; background: #000; padding: 5px; margin: 50px auto;}
div#mp3_player > div > audio{ width: 500px; background: #000; float: left; }
div#mp3_player > canvas { width: 500px; height: 30px; background: #002D3C; float: left;}
</style>
<script>
//create new instance of audio
var audio = new Audio();
audio.src = 'C:/Users/Adam/Desktop/1901.m4a';
audio.controls = true;
audio.loop = true;
audio.autoplay = true;
var canvas, ctx, …