直接上代码:
在页面上切入一个音乐播放器:
<div class="myaudio">
<audio id="myAudio" controls="controls" autoplay="true" src="http://luoo.800edu.net/low/luoo/radio665/01.mp3"></audio>
</div>
1. controls="controls" 表示在页面上显示:开始/暂停 的控制按钮。
2. autoplay="true" 表示打开网页时,自动播放。
3. .volume=0.06 控制音量大小,下面的代码控制自动播放时,将音量调的很小。
$(function(){
// 控制audio默认声音大小
// $("#myAudio").prop("volume", "0.06");
$("#myAudio")[0].volume=0.06;
});
4. 暂停和播放的控制如下,直接使用 play() 和 pause()函数:
function play()
{
$("#myAudio")[0].play();
}
function pause()
{
$("#myAudio")[0].pause();
}
5. 切换播放歌曲,改变 src 属性就可以了:
$("#myAudio").attr("src", "http://luoo.800edu.net/low/luoo/radio665/02.mp3");
分享到:
相关推荐
音频转码工具(用于将微信语音 amr 格式转换为 mp3 格式以便在 html5 的 audio 标签中进行播放).zip 音频转码工具(用于将微信语音 amr 格式转换为 mp3 格式以便在 html5 的 audio 标签中进行播放).zip 音频转码...
本应用是利用HTML5提供的Audio标签搭配JQuery开发完成的音乐播放
HTML5 AudioVideo 标签,属性,方法,事件
html5 audio demo【修复拖动进度条bug】 html5 audio demo【修复拖动进度条bug
本工具用于将微信语音 amr 格式转换为 mp3 格式以便在 html5 的 audio 标签中进行播放
标签可以在HTML5浏览器中播放音频文件。 <audio>默认提供一个控制面板,但是有些时候我们只需要播放声音,控制面板由我们自己来定义其显示的状态。 这里我们可以使用JS来进行控制,代码如下: 复制代码代码...
html5 音乐播放器 audio 标签使用概述.docxhtml5 音乐播放器 audio 标签使用概述.docx
HTML5中的audio标签概述.pdf 学习资料 复习资料 教学资源
HTML5中的audio标签概述案例.pdf 学习资料 复习资料 教学资源
主要介绍了Html5标签audio的样式修改 ,对html5 audio标签样式相关知识感兴趣的朋友一起学习吧
HTML5新增加的audio和video标签让我们增加了很多惊喜,可以让我们更方便的在网页中播放音频和视频。但目前很多浏览器不支持,无法在旧版的IE浏览器中使用。html5media.min.js却是一个能让这两个标签在各种新旧版IE...
浏览器HTML5标签video和audio支持 包含其相应支持的格式
HTML5视频播放器美化HTML5视频播放器美化HTML5视频播放器美化
在HTML5标准网页里面,我们可以运用audio标签来完成我们对声音的调用及播放。以下是最经常见到的运用HTML5三种基本格式: 1.最少的代码 复制代码代码如下:<audio src=”song.ogg” controls=”controls”><...
HTML5的最强大之处莫过于对媒体文件的处理,如利用一个简单的...类似地,在HTML5中也有对应的处理音频文件的标签,那就是audio标签。通过本文给大家介绍HTML5使用Audio标签实现歌词同步的效果,感兴趣的朋友一起学习吧
html5开发
本文为大家详细介绍下html5 音乐播放器 audio 标签的使用概述,喜欢html5的朋友可以参考下哈,希望对大家有所帮助
MP3播放器1.3-基于HTML5AUDIO标签的本地播放器 1.播放本地歌曲,模式包括单曲播放/单曲循环播放/顺序播放/顺序循环播放 2.自主选择文件和删除文件,自由切换上一首/下一首,随时暂停/播放 3.显示正在播放歌曲和剩余...