htm5 vido.js 播放器
需求:页面中有2个普通按钮a,b。还有一个video标签,能成功播放出视频。。我想要的效果是,点击a按钮,视频开始播放,点击b按钮,视频播放停止!!!
----------------------------------------------------code---------------------------------------------------------------------------
<!DOCTYPE html> <html> <head> <title>Simple JavaScript Controller</title> <script type="text/javascript"> function playPause() { var myVideo = document.getElementsByTagName('video')[0]; //获取视频video if (myVideo.paused){ myVideo.play(); }else{ myVideo.pause(); } function makeBig() { //全屏 高度2倍 var myVideo = document.getElementsByTagName('video')[0]; myVideo.height = (myVideo.videoHeight * 2 ) ; } function makeNormal() { //取消全屏 var myVideo = document.getElementsByTagName('video')[0]; myVideo.height = (myVideo.videoHeight) ; } </script> </head> <body> <div class="video-player" align="center"> <video src="myMovie.m4v" poster="poster.jpg" ></video> <!--视频 --> <br> <a href="javascript:playPause();">Play/Pause</a> <br> <!--播放 暂停--> <a href="javascript:makeBig();">2x Size</a> <!--放大视频-->
[解决办法] <a href="javascript:makeNormal();">1x Size</a> <br> <!--还原视频 --> </div> </body> </html>
[解决办法]:
var myVideo = document.getElementsByTagName('video')[0];
可以换成
document.getElementById('videoId');
<video src="myMovie.m4v" poster="poster.jpg" id="videoId"></video>
[解决办法]
额。来晚了。。。
停止的话...
myVideo.currentTime = 0; //属性设置或返回音频/视频播放的当前位置(以秒计)。当设置该属性时,播放会跳跃到指定的位置。
myVideo.pause();
------解决方案--------------------
mark
原文地址:http://www.reader8.cn/jiaocheng/20130619/1350009.html
http://www.reader8.cn/jiaocheng/javascript/
htm5 vido.js 播放器的更多相关文章
- 使用EasyNVR无插件流媒体服务器接口和EasyPlayer.js播放器插件实现web网页H5播放无插件
1.背景需求 很多客户在使用EasyNVR无插件流媒体服务器时,不喜欢产品化的界面,有时可能满足不了日常观看使用的需求.因此软件提供丰富的HTTP接口,供第三方平台调用集成.但是有时客户这边可能没有专 ...
- 利用Docker挂载Nginx-rtmp(服务器直播流分发)+FFmpeg(推流)+Vue.js结合Video.js(播放器流播放)来实现实时网络直播
原文转载自「刘悦的技术博客」https://v3u.cn/a_id_75 众所周知,在视频直播领域,有不同的商家提供各种的商业解决方案,其中比较靠谱的服务商有阿里云直播,腾讯云直播,以及又拍云和网易云 ...
- js播放器
<object?id="player"?height="64"?width="260"?classid="CLSID:6BF ...
- 网页播放器(jsp、js)
jsp对控件显示 <%@ page language="java" import="java.util.*" pageEncoding="UTF ...
- 10个免费开源的JS音乐播放器插件
点这里 音乐播放器在网页设计中有时候会用到,比如一些时尚类.音乐或影视类等项目,但这些 网页播放器 插件比较少见,所以这里为大家整理一个集合,也许会有用到的时候. 下面整理的播放器有些是支持自适应的, ...
- 使用html5中video自定义播放器必备知识点总结以及JS全屏API介绍
一.video的js知识点: controls(控制器).autoplay(自动播放).loop(循环)==video默认的: 自定义播放器中一些JS中提供的方法和属性的记录: 1.play()控制视 ...
- 原生JS实现音乐播放器!
前 言 最近在复习JS,觉得音乐播放器是个挺有意思的东西,今天就来用我们最原生的JS写一个小小的音乐播放器~ 主要功能: 1.支持循环.随机播放 2.在播放的同时支持图片的 ...
- 黄聪:原生js的音频播放器,兼容pc端和移动端(原创)
更新时间:2018/9/3 下午1:32:54 更新说明:添加音乐的loop设置和ended事件监听 loop为ture的时候不执行ended事件 1 2 3 4 5 6 7 8 9 10 11 12 ...
- 小型音乐播放器插件APlayer.js的简单使用例子
本篇博客将会给出一个小型音乐播放器插件APlayer.js的使用例子.关于APlayer.js的具体介绍和Github地址,可以参考: https://github.com/MoePlayer/A ...
随机推荐
- 前端MVC Vue2学习总结(八)——前端路由
路由是根据不同的 url 地址展示不同的内容或页面,早期的路由都是后端直接根据 url 来 reload 页面实现的,即后端控制路由. 后来页面越来越复杂,服务器压力越来越大,随着AJAX(异步刷新技 ...
- 高效的MySQL的批插入 BULK INSERT
原文:http://www.open-open.com/code/view/1453702496573 MySQL的批插入 BULK INSERT和load data的速度差不多,并且可靠. 语法如下 ...
- iOS的应用程序实现之间的内容分享
前言 我们在iOS的平台上想要实现不同应用之间的内容分享一般有几种常用方式: 一种第的英文通过AirDrop实现不同设备的应用之间文档和数据的分享; 第二种是给每个应用程序定义一个URL方案,通过访问 ...
- vim中末行去掉^M
在Ubuntu系统中打开文件,发现文件中每一个末行都有^M,我们要做的是知道这一个无关的字符是什么作用,然后删除掉这一个无关的字符. 工具/原料 ubuntu操作系统 Vim编辑器 方法/步骤 ...
- Java学习之String StringBuffer StringBuilder区别
1.String:对象长度是不可变的,是线程安全. 2.StringBuffer:对象长度是可变的,是线程安全. 3.StringBuilder:对象长度是可变,不是线程安全.
- 这个捕鱼游戏制作的真心不错,原创音乐,AV动作,让人流连忘返啊呵呵
女生看完这篇文章后果断地命令男朋友打开电脑和手机 2014-10-10 茶娱饭后 本人纯屌丝宅男一名.专注游戏十年有余,玩过无数大大小小的游戏,对捕鱼游戏情有独钟.我不想说在捕鱼游戏方面有多专业 ...
- 【前端JS】radio 可单选可点击取消选中
普通情况下 radio 单选框仅仅能实现多选一的效果,可是一旦选择当中一个后,这个单选框就不可点击取消其选中状态了.这样的功能在某些业务环境下并不适用.有时我们既须要单选框的多选一效果.也须要复选框的 ...
- wxpython中鼠标样式的获取与匹配
在wxpython中定义有多种默认的鼠标样式,譬如:wx.CURSORCROSS wx.CURSORHAND等等, 此处按下不表,可以参考wxpython的samples里面自带的cursor例子 这 ...
- V-Play 文档翻译 Page
V-Play 文档翻译 Page 翻译:qyvlik 应用的一个页面. VPlayApps 1.0 Inherits: MouseArea Inherited By: ListPage 属性 Item ...
- filter、servlet、interceptor的执行顺序
1. Filter可认为是Servlet的一种“变种”,它主要用于对用户请求进行预处理,也可以对HttpServletResponse进行后处理,是个典型的处理链.它与Servlet的区别在于:它不能 ...