HTML5+CSS3+JS小实例：音频可视化

实例：音频可视化

技术栈：HTML+CSS+JS

效果：

源码：

【HTML】

<!DOCTYPE html>
<html lang="zh-CN">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>音频可视化</title><link rel="stylesheet" href="209.css">
</head>
<body><canvas></canvas><audio src="/mp3/夜曲.mp3" controls></audio>
</body>
</html><script src="209.js"></script>

【CSS】

*{margin:

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/619022.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

C++学习笔记——私有继承、多重继承、类模板

C++学习笔记——私有继承、多重继承、类模板

目录 一、私有继承 二、多重继承 三、类模板 四、一个使用私有继承的示例代码 4.1代码 4.2输出结果 五、多重继承案列 六、类模板案例 C中的继承和模板是非常强大和灵活的特性&#xff0c;它们可以帮助我们实现代码复用、抽象和泛化等目标。本文将着重介绍私有继承、多…
阅读更多...
class_1:qt的安装及基本使用方式

class_1:qt的安装及基本使用方式

一、选择组件&#xff1a; 1、windows编译工具&#xff1a;MinGW 7.30 32-bit MinGW 7.30 64-bit 2、QT源代码&#xff1a;sources 3、QT的绘图模块&#xff1a;QT charts 4、QT虚拟键盘&#xff1a;QT Virtual Keyboard 5、QT Creational 4.12.2 GDB 二、新建QT项目 文…
阅读更多...
Linux完全卸载Anaconda3和MiniConda3

Linux完全卸载Anaconda3和MiniConda3

如何安装Anaconda3和MiniConda3请看这篇文章&#xff1a; 安装Anaconda3和MiniConda3_minianaconda3-CSDN博客文章浏览阅读474次。MiniConda3官方版是一款优秀的Python环境管理软件。MiniConda3最新版只包含conda及其依赖项如果您更愿意拥有conda以及超过720个开源软件包&…
阅读更多...
高通平台开发系列讲解（USB篇）adb function代码分析

高通平台开发系列讲解（USB篇）adb function代码分析

文章目录 一、FFS相关动态打印二、代码入口三、ffs_alloc_inst四、ep0、ep1&ep2的注册五、读写过程沉淀、分享、成长，让自己和他人都能有所收获！😄 📢本文主要介绍高通平台USB adb function代码f_fs.c。 一、FFS相关动态打印 目录：msm-4.14/drivers/usb/gadget/fun…
阅读更多...
docker+jmeter实现windows作为主控机，linux作为负载机的分布式压测环境搭建

docker+jmeter实现windows作为主控机，linux作为负载机的分布式压测环境搭建

dockerjmeter实现windows作为主控机&#xff0c;linux作为负载机的分布式压测环境搭建 1、搭建环境说明2、windows主控机安装Jmeter3、linux负载机安装Jmeter3.1、安装docker环境3.2、使用docker安装jmeter 4、windows主控机分发测试任务 1、搭建环境说明 准备一台windows主机…
阅读更多...
时间序列数据库选型: influxdb； netdiscover列出docker实例们的ip，docker管理工具lazydocker、scope

时间序列数据库选型: influxdb； netdiscover列出docker实例们的ip，docker管理工具lazydocker、scope

influxdb influxdb: 有收费版本、有开源版本 influxdb 安装、启动(docker) docker run -itd --name influxdb-dev -p 8086:8086 influxdb #influxdb的web客户端(端口8003)被去掉了 #8006是web-service端口#docker exec -it influxdb-dev bashinfluxdb 自带web界面 从后面的…
阅读更多...
Rust-函数

Rust-函数

简介 Rust的函数使用关键字fn开头。 函数可以有一系列的输入参数&#xff0c;还有一个返回类型。 函数体包含一系列的语句(或者表达式)。 函数返回可以使用return语句&#xff0c;也可以使用表达式。 Rust编写的可执行程序的入口就是fn main()函数。 以下是一个函数的示例…
阅读更多...
代码随想录算法训练营第四天 |24.两两交换链表中的节点，19.删除链表的倒数第N个节点，面试题02.07.链表相交，142、环形链表II

代码随想录算法训练营第四天 |24.两两交换链表中的节点，19.删除链表的倒数第N个节点，面试题02.07.链表相交，142、环形链表II

链表基础 1、链表定义&#xff1a; &#xff08;1&#xff09;链表是一种通过指针串联在一起的线性结构&#xff0c;每一个节点由两部分组成&#xff0c;一个是数据域一个是指针域&#xff08;存放指向下一个节点的指针&#xff09;&#xff0c;最后一个节点的指针域指向null…
阅读更多...
C++核心编程——文件操作

C++核心编程——文件操作

本专栏记录C学习过程包括C基础以及数据结构和算法&#xff0c;其中第一部分计划时间一个月&#xff0c;主要跟着黑马视频教程&#xff0c;学习路线如下&#xff0c;不定时更新&#xff0c;欢迎关注。 当前章节处于&#xff1a; ---------第1阶段-C基础入门 ---------第2阶段实战…
阅读更多...
ROS无人机开发常见错误

ROS无人机开发常见错误

一. Ubuntu 相关 1、SSH远程连接报错 解决方案&#xff1a;终端运行上述图中选中部分&#xff0c;更新一下即可 第一步&#xff1a; 第二步&#xff1a;根据提示输入yes后输入密码即可 第三步&#xff1a;成功后如下图所示 2、解决“E 无法获得锁/ var/lib/apt/lists/ (11 资…
阅读更多...
Altium Desigenr 孔 规则修改2

Altium Desigenr 孔 规则修改2

1、过孔修改 在这里插入图片描述 2、物理孔
阅读更多...
[足式机器人]Part2 Dr. CAN学习笔记-Advanced控制理论 Ch04-7 LQR控制器 Linear Quadratic Regulator

[足式机器人]Part2 Dr. CAN学习笔记-Advanced控制理论 Ch04-7 LQR控制器 Linear Quadratic Regulator

本文仅供学习使用 本文参考&#xff1a; B站&#xff1a;DR_CAN Dr. CAN学习笔记-Advanced控制理论 Ch04-7 LQR控制器 Linear Quadratic Regulator 线性控制器设计-轨迹跟踪&#xff08;Fellow a Desired Path&#xff09;
阅读更多...
如何使用 Helm 在 K8s 上集成 Prometheus 和 Grafana｜Part 2

如何使用 Helm 在 K8s 上集成 Prometheus 和 Grafana｜Part 2

在 Part 1 中&#xff0c;我们一起了解了什么是 Prometheus 和 Grafana&#xff0c;以及使用这些工具的前提条件和优势。在本部分&#xff0c;将继续带您学习如何安装 Helm 以及如何使用 Prometheus Helm Charts。 开始使用 Helm 和 Helm Chart ArtifactHub 为 Helm Chart 提供…
阅读更多...
Netty开篇——NIO章上（三）

Netty开篇——NIO章上（三）

Java NIO基本介绍 java non-blocking I/O 称为NIO(也叫New IO)。JDK4开始提供,同步非阻塞相关内容在 java.nio 包及子包下&#xff0c;对java.io 包中的很多类进行改写。三大核心: Channel(通道)&#xff0c;Buffer(缓冲区),Selector(选择器)NIO是面向缓冲区或者面向块编程的。…
阅读更多...
Centos7.9服务器编译安装Nginx1.24.0和php8.3

Centos7.9服务器编译安装Nginx1.24.0和php8.3

Centos7.9服务器编译安装Nginx1.24.0和php8.3 服务器nginx原版本有安全漏洞，需要升级，由于原始是yum源安装，通过yum直接升级，无法正常升级完成，故而需要卸载yum源，重新编译安装。 1、查看原来nginx版本，ps查看原来nginx进程，运行状态： ps aux | grep nginx ​ root …
阅读更多...
【HuggingFace Transformer库学习笔记】基础组件学习：Evaluate

【HuggingFace Transformer库学习笔记】基础组件学习：Evaluate

基础组件学习——Evaluate Evaluate使用指南 查看支持的评估函数 # include_community&#xff1a;是否添加社区实现的部分 # with_details&#xff1a;是否展示更多细节 evaluate.list_evaluation_modules(include_communityFalse, with_detailsTrue)加载评估函数 accuracy…
阅读更多...
RK3568驱动指南｜第十二篇 GPIO子系统-第135章 GPIO子系统与pinctrl子系统相结合实验

RK3568驱动指南｜第十二篇 GPIO子系统-第135章 GPIO子系统与pinctrl子系统相结合实验

瑞芯微RK3568芯片是一款定位中高端的通用型SOC&#xff0c;采用22nm制程工艺&#xff0c;搭载一颗四核Cortex-A55处理器和Mali G52 2EE 图形处理器。RK3568 支持4K 解码和 1080P 编码&#xff0c;支持SATA/PCIE/USB3.0 外围接口。RK3568内置独立NPU&#xff0c;可用于轻量级人工…
阅读更多...
解决ELK日志收集中Logstash报错的关键步

解决ELK日志收集中Logstash报错的关键步

ElK执行日志收集的时候logstash报错&#xff1a; Failed to execute action {:action>LogStash::PipelineAction::Create/pipeline_id:main, :exception>“LogStash::ConfigurationError”, :message>“Expected one of [^\r\n], “\r”, “\n” at line 88, column 4…
阅读更多...
ChromeDriver 添加到系统PATH

ChromeDriver 添加到系统PATH

在软件测试和自动化脚本中&#xff0c;ChromeDriver是一个不可或缺的工具。为了方便使用&#xff0c;将其添加到系统PATH中是一个明智的选择。以下是在Windows、macOS或Linux上完成此任务的详细步骤。 在 Windows 上&#xff1a; 下载并保存 ChromeDriver&#xff1a; 访问Chro…
阅读更多...
openEuler安装Docker艰辛路程

openEuler安装Docker艰辛路程

文章目录 安装docker测试docker关于windows docker拉取镜像查看所有镜像删除镜像删除不在运行的进程强制删除正在运行的进程 启动docker容器服务-d测试 停止docker容器服务查看docker启动进程更新容器(没有自启动功能&#xff0c;更新为自启动)docker端口映射进入容器修改内容退…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023