video.js视频播放上手
html案例
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><title>videojs视频播放</title>
</head>
<link href="https://cdnjs.cloudflare.com/ajax/libs/video.js/7.3.0/video-js.min.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/video.js/7.3.0/video.min.js"></script><body><h3>视频播放</h3><video id="example_video_1" class="video-js vjs-default-skin" controls preload="none"poster="http://vjs.zencdn.net/v/oceans.png"><source src="http://vjs.zencdn.net/v/oceans.mp4" type="video/mp4"></video>
</body></html>
<script>var player=videojs('example_video_1',{muted: true,controls: true,height: 300,width: 400,loop: true,});
</script>npm+vue3案例
npm安装依赖
npm install --save-dev video.jsmain.js全局配置
import { createApp } from 'vue'
import App from './App.vue'
import 'video.js/dist/video-js.css'
import videojs from 'video.js'
import 'videojs-flash'const app = createApp(App)
app.provide('videojs', videojs)
app.mount('#app')
应用
<template><video class="video-js" ref="videoPlayer"></video>
</template><script setup>
import { ref, onMounted, onBeforeUnmount } from 'vue'
import { inject } from 'vue'const videojs = inject('videojs')
const videoPlayer = ref(null)
let player = nullonMounted(() => {player = videojs(videoPlayer.value, {muted: true,controls: true,height: 300,width: 400,loop: true,})player.src({type: 'video/mp4',src: 'http://vjs.zencdn.net/v/oceans.mp4'})player.on('ended', () => {console.log('播放结束')})
})onBeforeUnmount(() => {if (player) {player.dispose()}
})
</script><style>
/* 你可以在这里添加样式 */
</style>相关文章：
video.js视频播放上手
html案例 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><title>videojs视频播放</title> </head> <link href"https://cdnjs.cloudflare.com/ajax/libs/video.js/7.3.0/video-js.min.cs…...
【LLM-Agent】Building effective agents和典型workflows
note Anthropic的工程经验： 大道至简，尽量维护系统的简洁；尽量让过程更加透明（因为你依赖的是LLM的决策，如果只看输出不看过程，很容易陷入难以debug的情况）；对LLM需要调用的工具&am…...
《量子比特大阅兵：不同类型量子比特在人工智能领域的优劣势剖析》
在科技的前沿，量子比特与人工智能的融合正开启一扇全新的大门。不同类型的量子比特，如超导、离子阱、光量子等，在与人工智能结合时展现出独特的优势与劣势。 超导量子比特 超导量子比特是目前应用较为广泛且研究相对成熟的量子比特类型。它…...
《探秘开源大模型：AI 世界的“超级引擎”》
《探秘开源大模型：AI 世界的“超级引擎”》 一、开源大模型崛起之路二、开源大模型发展历程回顾（一）早期奠基：理论突破与初步实践（二）快速发展：百花齐放的模型格局（三）当下态势：走向成熟与多元融合三、开源大模型核心技术剖析（一）Transformer 架构：基石之稳（二）…...
el-table行列转换简单版，仅限单行数据
原始数据格式如下，如果不是此格式，请转换成以下格式在进行以下操作 [{ label: name, value: Tom },{ label: age, value: 25 },{ label: country, value: UK } ]代码如下 <template><el-table :data"tableData" style"width: …...
2025年1月4日蜻蜓q旗舰版st完整开源·包含前后端所有源文件·开源可商用可二开·优雅草科技·优雅草kir|优雅草星星|优雅草银满|优雅草undefined
2025年1月4日蜻蜓q旗舰版st完整开源包含前后端所有源文件开源可商用可二开优雅草科技优雅草kir|优雅草星星|优雅草银满|优雅草undefined 产品介绍： 本产品主要贡献者优雅草科技优雅草kir|优雅草星星|优雅草银满|优雅草undefined-青史留名，时光如川浪淘…...
SQL把字符串按逗号分割成记录
在 SQL 中，可以通过以下方法将字符串按逗号分割，并将每个分割的值作为单独的记录插入到结果集中。以下是针对不同数据库系统的实现方法： 1. 使用 STRING_SPLIT（SQL Server 2016） STRING_SPLIT 是 SQL Server 提供的内置…...
C#设计模式（行为型模式）：观察者模式
C#设计模式：观察者模式，让对象间通信更优雅 在软件开发中，我们经常会遇到一个对象的状态发生改变，其他对象需要自动更新或做出相应反应的场景。例如： GUI事件处理： 当用户点击按钮时，按钮需要…...
pytorch镜像源
我以为的 pip install torch2.3.1cu118 torchvision0.18.1cu118 torchaudio2.3.1cu118 -f https://download.pytorch.org/whl/torch_stable.html实际上，有很多加速方案 为提高下载速度可以使用国内的镜像源来安装与 CUDA 11.8 兼容的 PyTorch。 方法 1：…...
Verilog语法之常用行为级语法
摘要：本文主要介绍了一些在verilog中的行为级语法，并且提供了大量的运行实际例子，可以通过这些例子感受行为级语法在仿真中的巨大作用。 概述：行为级语法是RTL级的上一层，或者说是比RTL级更高级的语法，其语…...
PADS Logic原理图中有很多页原理图，如何（怎样）删除其中一页或者多页
我们在进行PADS Logic进行原理图设计的时候，有时候可能遇到一次性设计了很多页的原理图，比如说十几页的原理图。那么我们在进行PADS Layout的时候，可能将这些原理图绘制两块板或者多块PCB板，那么这时候我们需要将其中的一张原理图…...
蓝色简洁引导页网站源码
一款蓝色的简洁引导页，适合资源分发和网站备用引导。 1.源码上传至虚拟机或者服务器 2.绑定域名和目录 3.访问域名安装 4.安装完成后就行了 https://pan.quark.cn/s/b2d8b9c5dc7f https://pan.baidu.com/s/17h1bssUNhhR9DMyNTc-i9Q?pwd84sf https://caiyun.139.com…...
Apache PDFBox添加maven依赖,pdf转成图片
要使用Apache PDFBox将PDF文件转换为图片，并将其添加到Maven项目中，您可以按照以下步骤操作： 1. 添加Maven依赖 在您的pom.xml文件中添加Apache PDFBox的依赖。请确保使用最新版本的PDFBox库。截至2025年，以下是推荐的配置&…...
mybatis 和 mybatisPlus 兼容性问题
项目采用的是 mybatis， 后续引入了 mybatisPlus，用 mybatisX 创建的四个类一直报错，提示找不到符号，意识到 mybatis 和 mybatisPlus 的兼容性问题，通过修改配置 两者的配置如下 #配置mybatis配置 mybatis:type-aliase…...
Mono里运行C#脚本23—mono_jit_exec
前面已经分析一部分代码，可以打下基础知识，当然还有很多其它部分的内容，没有深入去了解。 接着下来，我们去探索一下怎么样找到执行应用程序的入口。 在这个嵌入脚本程序里，有一个这样的函数调用： main_function (domain, file, argc - 1, argv + 1); 这个函数的作用，…...
第十一章 图论
/* * 题目名称：连通图 * 题目来源：吉林大学复试上机题 * 题目链接：http://t.cn/AiO77VoA * 代码作者：杨泽邦(炉灰) */#include <iostream> #include <cstdio>using namespace std;const int MAXN 1000 10;int fathe…...
纯前端实现将pdf转为图片（插件pdfjs）
需求来源 预览简历功能在移动端，由于用了一层iframe把这个功能嵌套在了app端，再用一个iframe来预览，只有ios能看到，安卓就不支持，查了很多资料和插件，原理基本上都是用iframe实现的。最终转换思路…...
【IT人物系列】之MySQL创始人
前言 当今世界有无数的人构成，其中有些人做了一些改变世界的事情，比如：乔布斯缔造了Apple帝国，詹姆斯高斯林创造了Java语言等。正是这些优秀的人做的这些优秀的事情，让这个世界更加美好。因此他们值得铭记。 从今天…...
在Typora中实现自动编号
文章目录 在Typora中实现自动编号1. 引言2. 准备工作3. 自动编号的实现3.1 文章大纲自动编号3.2 主题目录（TOC）自动编号3.3 文章内容自动编号3.4 完整代码 4. 应用自定义CSS5. 结论 在Typora中实现自动编号 1. 引言 Typora是一款非常流行的Markdown编辑…...
Single Shot MultiBox Detector(SSD)
文章目录 摘要Abstract1. 引言2. 框架2.1 网络结构2.2 损失函数2.3 训练细节 3. 创新点和不足3.1 创新点3.2 不足 参考总结 摘要 与Faster R-CNN相比，SSD是一个真正的单阶段多目标检测模型，同时也是一个全卷积网络，不仅检测准确率高ÿ…...
centos 7 部署awstats 网站访问检测
一、基础环境准备（两种安装方式都要做） bash # 安装必要依赖 yum install -y httpd perl mod_perl perl-Time-HiRes perl-DateTime systemctl enable httpd # 设置 Apache 开机自启 systemctl start httpd # 启动 Apache二、安装 AWStats࿰…...
江苏艾立泰跨国资源接力：废料变黄金的绿色供应链革命
在华东塑料包装行业面临限塑令深度调整的背景下，江苏艾立泰以一场跨国资源接力的创新实践，重新定义了绿色供应链的边界。 跨国回收网络：废料变黄金的全球棋局 艾立泰在欧洲、东南亚建立再生塑料回收点，将海外废弃包装箱通过标准…...
第一篇：Agent2Agent (A2A) 协议——协作式人工智能的黎明
AI 领域的快速发展正在催生一个新时代，智能代理（agents）不再是孤立的个体，而是能够像一个数字团队一样协作。然而，当前 AI 生态系统的碎片化阻碍了这一愿景的实现，导致了“AI 巴别塔问题”——不同代理之间…...
使用 SymPy 进行向量和矩阵的高级操作
在科学计算和工程领域，向量和矩阵操作是解决问题的核心技能之一。Python 的 SymPy 库提供了强大的符号计算功能，能够高效地处理向量和矩阵的各种操作。本文将深入探讨如何使用 SymPy 进行向量和矩阵的创建、合并以及维度拓展等操作，并通过具体…...
云原生安全实战：API网关Kong的鉴权与限流详解
🔥「炎码工坊」技术弹药已装填！ 点击关注 → 解锁工业级干货【工具实测|项目避坑|源码燃烧指南】 一、基础概念 1. API网关（API Gateway） API网关是微服务架构中的核心组件，负责统一管理所有API的流量入口。它像一座…...
CRMEB 中 PHP 短信扩展开发：涵盖一号通、阿里云、腾讯云、创蓝
目前已有一号通短信、阿里云短信、腾讯云短信扩展 扩展入口文件 文件目录 crmeb\services\sms\Sms.php 默认驱动类型为：一号通 namespace crmeb\services\sms;use crmeb\basic\BaseManager; use crmeb\services\AccessTokenServeService; use crmeb\services\sms\…...
BLEU评分：机器翻译质量评估的黄金标准
BLEU评分：机器翻译质量评估的黄金标准 1. 引言 在自然语言处理(NLP)领域，衡量一个机器翻译模型的性能至关重要。BLEU (Bilingual Evaluation Understudy) 作为一种自动化评估指标，自2002年由IBM的Kishore Papineni等人提出以来，…...
根目录0xa0属性对应的Ntfs!_SCB中的FileObject是什么时候被建立的----NTFS源代码分析--重要
根目录0xa0属性对应的Ntfs!_SCB中的FileObject是什么时候被建立的 第一部分： 0: kd> g Breakpoint 9 hit Ntfs!ReadIndexBuffer: f7173886 55 push ebp 0: kd> kc # 00 Ntfs!ReadIndexBuffer 01 Ntfs!FindFirstIndexEntry 02 Ntfs!NtfsUpda…...
【Elasticsearch】Elasticsearch 在大数据生态圈的地位 实践经验
Elasticsearch 在大数据生态圈的地位 & 实践经验 1.Elasticsearch 的优势1.1 Elasticsearch 解决的核心问题1.1.1 传统方案的短板1.1.2 Elasticsearch 的解决方案 1.2 与大数据组件的对比优势1.3 关键优势技术支撑1.4 Elasticsearch 的竞品1.4.1 全文搜索领域1.4.2 日志分析…...
针对药品仓库的效期管理问题，如何利用WMS系统“破局”
案例： 某医药分销企业，主要经营各类药品的批发与零售。由于药品的特殊性，效期管理至关重要，但该企业一直面临效期问题的困扰。在未使用WMS系统之前，其药品入库、存储、出库等环节的效期管理主要依赖人工记录与检查。库…...