videojs改变音量大小
<audio id=example-video preload="auto" class="video-js vjs-default-skin" type="audio/wav" hidden="hidden">
<script type="text/javascript" th:src="@{/js/jquery3.4.1.js}"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/video.js/7.6.4/video.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/video.js/7.6.4/lang/zh-CN.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/videojs-contrib-hls/5.15.0/videojs-contrib-hls.min.js"></script>
<script src="https://cdn.bootcss.com/layer/2.3/layer.js"></script>
<link href="https://cdn.bootcss.com/layer/2.3/skin/layer.css" rel="stylesheet">
<audio id=example-video preload="auto" class="video-js vjs-default-skin" type="audio/wav" hidden="hidden">
<span>音量</span><input type="range" min="10" max="100" id="volume" step="1" value="50"/><span id="volumeLabel">50%</span>
$("#volume").change(function(){
var volume = $(this).val();
$("#volumeLabel").text("x"+volume+"%");
}); var player = videojs('example-video');
player.ready(function() {
var _this = this
//速率
var playbackRate = $("#playbackRate").val();
var speed = parseFloat(playbackRate); var volume = parseFloat($("#volume").val()/100.0); setTimeout(function() {
_this.volume(volume);
//笔者在测试播放视频控件的demo里发现volume是一个属性,不是函数
},20);
});
...
player.play();
videojs改变音量大小的更多相关文章
- Android 获取 AudioRecord 麦克风音量大小并做选择性发送
extends:http://blog.csdn.net/alvinhuai/article/details/8955127,http://mikespook.com/2010/11/android- ...
- 控制音量大小widget
由于手机音量按键非常悲剧的掉了.无法控制手机音量大小.使用起来非常不方便.所以决定写一个小widget放在桌面能够随时控制音量吧.也算是解决一点便利问题. 1.一个简单的widget 由于我的需求非常 ...
- JS控制Video播放器(快进、后退、播放、暂停、音量大小)
思路: 一.首先监听触发事件. 比如:向上键对应的keyCode为38,向下键对应的keyCode为40,向左键对应的keyCode为37,向右键对应的keyCode为39,空格键对应的keyCode ...
- JavaScript动画-拖拽改变元素大小
▓▓▓▓▓▓ 大致介绍 拖拽改变元素大小是在模拟拖拽上增加了一些功能 效果:拖拽改变元素大小 ▓▓▓▓▓▓ 拖拽改变元素大小原理 首先这个方块得知道我们想要改变这个它的大小,所以我给它设定一个范围,当 ...
- javascript动画系列第四篇——拖拽改变元素大小
× 目录 [1]原理简介 [2]范围圈定 [3]大小改变[4]代码优化 前面的话 拖拽可以让元素移动,也可以改变元素大小.本文将详细介绍拖拽改变元素大小的效果实现 原理简介 拖拽让元素移动,是改变定位 ...
- WPF实现无边框窗体拖拽右下角▲ 改变窗体大小【framwork4.0】 谢谢大家关注
效果图:(右下角拖拽改变窗体大小) 第一步:添加xaml代码: <Border Name="ResizeBottomRight" MouseMove="Resize ...
- 【Unity】改变向量的方向而不改变其大小
最近在做一个打砖块游戏时遇到一个小问题,就是小球有可能会在左右两个边界之间做循环往返运动而导致游戏无法继续进行下去,于是我打算让小球在垂直撞向边界时改变一下方向,但是速度不变,尝试了一些方法但是没有达 ...
- jquery插件之拖拽改变元素大小
该插件乃本博客作者所写,目的在于提升作者的js能力,也给一些js菜鸟在使用插件时提供一些便利,老鸟就悠然地飞过吧. 此插件旨在实现目前较为流行的拖拽改变元素大小的效果,您可以根据自己的实际需求来设置被 ...
- SQLSERVER复制优化之一《改变包大小》
SQLSERVER复制优化之一<改变包大小> 自从搭了复制之后以为可以安枕无忧了,谁不知问题接踵而来 这次遇到的问题是丢包,不知道情况的读者可以先看一下我之前写的一篇<SQLSERV ...
随机推荐
- 个人项目———Java实现WordCount
2018年系统分析与设计—个人项目作业 题目来自于 :https://edu.cnblogs.com/campus/xnsy/2018Systemanalysisanddesign/homework/ ...
- [51Nod 1244] - 莫比乌斯函数之和 & [51Nod 1239] - 欧拉函数之和 (杜教筛板题)
[51Nod 1244] - 莫比乌斯函数之和 求∑i=1Nμ(i)\sum_{i=1}^Nμ(i)∑i=1Nμ(i) 开推 ∑d∣nμ(d)=[n==1]\sum_{d|n}\mu(d)=[n== ...
- 跟随一条insert语句, 进入TiDB的源码世界(上)
TiDB是Google F1的开源实现: TiDB实现了基于mvcc的乐观锁,在线表结构变更,基于时间戳的数据线性一致性,等等: 为了可靠性,TiDB和Oracle一样,维护了百万级别的自动化测试用例 ...
- 24 | MySQL是怎么保证主备一致的?
在前面的文章中,我不止一次地和你提到了binlog,大家知道binlog可以用来归档,也可以用来做主备同步,但它的内容是什么样的呢?为什么备库执行了binlog就可以跟主库保持一致了呢?今天我就正式地 ...
- java重载和重写
重载(Overloading) (1) 方法重载是让类以统一的方式处理不同类型数据的一种手段.多个同名函数同时存在,具有不同的参数个数/类型. 重载Overloading是一个类中多态性的一种表现. ...
- LibreOJ #507. 「LibreOJ NOI Round #1」接竹竿
二次联通门 : LibreOJ #507. 「LibreOJ NOI Round #1」接竹竿 /* LibreOJ #507. 「LibreOJ NOI Round #1」接竹竿 dp 记录一下前驱 ...
- pc页面自动缩放到手机端
今天做了个pc的页面,看了别人的网站在手机端能把pc端的网页刚好缩放到手机端,看着很舒服. 于是想把自己的页面也这样搞一下,刚开始,想到的是利用css3的缩放来做,想的是当屏幕尺寸改变时缩放整个页面, ...
- XFTP 乱码
- 对list某个条件排序,并实现分页
package com.jcloud.aioc.api.controller.Test; import com.alibaba.fastjson.JSON; import org.apache.poi ...
- Hadoop界的Hello World!
Hadoop界的Hello World! 2019-05-20 19:50:09 应用平台:Eclipse+ubantu+hadoop包 注:例分析的形式给宝宝们解释一下,详细运行过程省略. 实例: ...