AudioControls | 易学教程

第一周周报

阅读更多关于第一周周报

第一周周报本周了解了一些HTML元素，以及一些CSS里面简单的标签、盒子的组成、常规流、浮动和一些基本的知识（定位看了，但还不会运用）。 1.网页基本结构 <!DOCTYPE html> <html lang= "en" > <head> <meta charset= "UTF-8" > <meta name= "viewport" content= "width=device-width, initial-scale=1.0" > <title>Document</title> </head> <body> </body> </html> 2.学习了一些HTML元素标签作用 H系列元素 h1~h6,标题文本，重要性递减 p标签表示一个段落 -img标签- -插入一个图片- a标签链接标签，可直接跳转至被链接的对象 -target标签- -用于指定链接页面打开的方式，有self和blank- 锚点定位能够快速定位到目标内容水平线标签横线< hr/> (这是一个单标签) 换行标签 < br/>（单标签） base标签设置整体链接的打开状态（在< head>中） pre元素此元素中内容不会出现空白折叠 3.字符集 GBK里面存储的字符比较少，仅仅存储了一些汉字和一些常用外文 UTF-8里面存储里世界上所有的文字

入门篇

阅读更多关于入门篇

来源于: https://yunp.top/app/index <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="vue.js"></script> </head> <body> <div id="vueapp"> <div> <audio controls ref="audio"></audio> </div> <div> <select v-model="selectedAudioDeviceIndex"> <option v-for="(d,index) in audioInputDevices" :value="index">{{d.label}}</option> </select> </div> </div> <script src="app.js"></script> </body> </html> (async function () { // let devices = await navigator.mediaDevices.enumerateDevices(); // // console.log(devices); let stream = await navigator.mediaDevices

网页播放器与播放器定制

阅读更多关于网页播放器与播放器定制

背景 H5支持了很多多媒体元素标签，至此可以很方便的使用video、audio等进行多媒体元素渲染。而在线视频、音乐等等，则更充分利用了此特性。实现网页在线音乐播放器或视频播放器也很简单，原理就是你的代码加网络的视频音频资源。方法这里我是用来做博客园个人主页的定制的，考虑加一个类似QQ空间的音乐播放器组件。当然，也可以加一下类似列表、播放模式等元素，也很简单，暂不赘述。代码 audio::-webkit-media-controls { 　　overflow: hidden !important } audio::-webkit-media-controls-enclosure { 　　width: calc(100% + 32px); 　　margin-left: auto; } 　　屏蔽下载，下载了就不好玩了。 <div id="mp3LjwSyt"></div> // 以上是html，我添加在了公告栏；以下是js var mp3Str = '<audio controls="" autoplay="" name="media" controls="controls" controlsList="nodownload" oncontextmenu="return false"><source src="xxx.mp3" type="audio/mpeg"></audio>

HTML5提高

阅读更多关于 HTML5提高

HTML5提高前言　　我个人觉得，当你学会了一些最基本的标签其实是够用的，但是在很多网页中可以发现很多新的标签。这个时候不知道它是干嘛的实际上心里是非常没底的，所以在这里我打算写一篇HTML5提高的文章，尽量以大白话的方式来告诉你H5中的一些实用小技巧。　　首先，要明白一点。我们使用标签时如果想要非常规范的一看就很专业的那种效果，我们应该利用原本标签的语义。　　如，写了一个 <main> 标签，别人一看就知道，原来这是主体内容的区域。　　当然，如果你全部使用 <div> 也没什么问题，只是不推荐这样做。　　其次，使用HTML标签不要在意他原本的模样，尽管他可能非常丑，因为我们可以随时通过CSS来修改它的样式。结构化标签 header 页眉　　 <header> 标签代表一块内容区域的页眉，即头部，它没什么具体语义，一个页面中可以有多个 <header> 标签，当然也可以只有一个。 footer 页脚　　 <footer> 标签代表一个页眉的页脚，即尾部。页脚通常包含文档的作者、版权信息、使用条款链接、联系信息等等。应该是与 <header> 相对应，不过没有也没关系。 nav 导航　　 <nav> 代表一块区域中的导航。注意！是一块区域的导航，这代表一个页面中可以有多个 <nav> 标签，当然也可以只有一个。 <! DOCTYPE html > <

Android 实现边听边录音探究

阅读更多关于 Android 实现边听边录音探究

关于我： 90后全栈独立开发者，18 年至今为一名自由职业者，19年成立 AgileStudio工作室，提供靠谱的软件定制服务。场景描述音乐中只有一种声音有时候很单薄的，我们经常希望把不同的声音加在一起，但是在录制的时候我们需要严格同步起来，把两种声音的时差控制在听觉允许的范围内，才可能获得我们想要的结果。另外一点，在录制的时候，为了不把播放的声音和人声或者器乐声混到一块，通常都需要录制者带着耳机边听边录。为了实现最终两个或者多个声音能非常好的契合到一起，除了要解决录音和播放的同步，还需要考虑到声音从手机传输到耳机上的延时。这个场景除了会出现在一些比较专业的音乐软件上，常用的 K 歌软件也不可避免会遇到这个问题。一线希望：MediaSyncEvent? 先抛出结论：并不能解决问题～肯定先从 SDK 入手，发现 AudioRecord 里面有个方法 startRecording(MediaSyncEvent syncEvent) , 再看了一遍文档，仿佛在黑暗中看到了一丝光亮。 The MediaSyncEvent class defines events that can be used to synchronize playback or capture * actions between different players and recorders.

如何在Html5中添加音频

阅读更多关于如何在Html5中添加音频

Web 上的音频直到现在，仍然不存在一项旨在网页上播放音频的标准。今天，大多数音频是通过插件（比如 Flash）来播放的。然而，并非所有浏览器都拥有同样的插件。 HTML5 规定了一种通过 audio 元素来包含音频的标准方法。 audio 元素能够播放声音文件或者音频流。音频格式当前，audio 元素支持三种音频格式： IE 9 Firefox 3.5 Opera 10.5 Chrome 3.0 Safari 3.0 Ogg Vorbis √ √ √ MP3 √ √ √ Wav √ √ √ 如何工作如需在 HTML5 中播放音频，您所有需要的是： <audio src="song.ogg" controls="controls"> </audio> control 属性供添加播放、暂停和音量控件。<audio> 与 </audio> 之间插入的内容是供不支持 audio 元素的浏览器显示的：实例 <audio src="song.ogg" controls="controls"> Your browser does not support the audio tag. </audio> 上面的例子使用一个 Ogg 文件，适用于Firefox、Opera 以及 Chrome 浏览器。要确保适用于 Safari 浏览器，音频文件必须是 MP3 或 Wav 类型。