js统制html5 【video】标签中视频的播放和停止

 
需求：页面中有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 播放器的更多相关文章

  1. 使用EasyNVR无插件流媒体服务器接口和EasyPlayer.js播放器插件实现web网页H5播放无插件

    1.背景需求 很多客户在使用EasyNVR无插件流媒体服务器时,不喜欢产品化的界面,有时可能满足不了日常观看使用的需求.因此软件提供丰富的HTTP接口,供第三方平台调用集成.但是有时客户这边可能没有专 ...

  2. 利用Docker挂载Nginx-rtmp(服务器直播流分发)+FFmpeg(推流)+Vue.js结合Video.js(播放器流播放)来实现实时网络直播

    原文转载自「刘悦的技术博客」https://v3u.cn/a_id_75 众所周知,在视频直播领域,有不同的商家提供各种的商业解决方案,其中比较靠谱的服务商有阿里云直播,腾讯云直播,以及又拍云和网易云 ...

  3. js播放器

    <object?id="player"?height="64"?width="260"?classid="CLSID:6BF ...

  4. 网页播放器（jsp、js）

    jsp对控件显示 <%@ page language="java" import="java.util.*" pageEncoding="UTF ...

  5. 10个免费开源的JS音乐播放器插件

    点这里 音乐播放器在网页设计中有时候会用到,比如一些时尚类.音乐或影视类等项目,但这些 网页播放器 插件比较少见,所以这里为大家整理一个集合,也许会有用到的时候. 下面整理的播放器有些是支持自适应的, ...

  6. 使用html5中video自定义播放器必备知识点总结以及JS全屏API介绍

    一.video的js知识点: controls(控制器).autoplay(自动播放).loop(循环)==video默认的: 自定义播放器中一些JS中提供的方法和属性的记录: 1.play()控制视 ...

  7. 原生JS实现音乐播放器！

      前  言            最近在复习JS,觉得音乐播放器是个挺有意思的东西,今天就来用我们最原生的JS写一个小小的音乐播放器~ 主要功能: 1.支持循环.随机播放 2.在播放的同时支持图片的 ...

  8. 黄聪：原生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 ...

  9. 小型音乐播放器插件APlayer.js的简单使用例子

      本篇博客将会给出一个小型音乐播放器插件APlayer.js的使用例子.关于APlayer.js的具体介绍和Github地址,可以参考: https://github.com/MoePlayer/A ...

随机推荐

  1. MVC RPC SOA 和微服务架构的区别

    MVC RPC SOA 微服务架构的区别 单体架构 MVC(Model View Controller) M是指业务模型,V是指用户界面,C则是控制器,使用MVC的目的是将M和V的实现代码分离,从而使 ...

  2. codevs3249搭积木

    3249 搭积木  时间限制: 1 s  空间限制: 128000 KB  题目等级 : 黄金 Gold 题解       题目描述 Description Petya有一个A×B×C的长方体积木,积 ...

  3. 使用JavaScript进行进制转换将字符串转换为十进制

    JS 是一个很神奇的语言,内制的的很多函数可以帮我们进行数(进)制转换: JS中可以直接使用16进制: var a = 将任意进制字符串转换为十进制,如二进制,八进制,十六进制, 第二数数不写即为最常 ...

  4. svm、logistic regression对比

    相同点:都是线性分类算法 不同点: 1.损失函数不同 LR:基于“给定x和参数,y服从二项分布”的假设,由极大似然估计推导 SVM: hinge loss + L2 regularization的标准 ...

  5. BZOJ 题目1036: [ZJOI2008]树的统计Count（Link Cut Tree，改动点权求两个最大值和最大值）

    1036: [ZJOI2008]树的统计Count Time Limit: 10 Sec  Memory Limit: 162 MB Submit: 8421  Solved: 3439 [Submi ...

  6. Multiple analytic account plans多辅助核算方案

    定义核算方案     菜单 会计/设置/辅助核算会计/多个方案         点击"创建"按钮         说明 辅助核算方案,输入方案名称     点击"添加一个 ...

  7. phpExcel大数据量情况下内存溢出解决

    版本:1.7.6+ 在不进行特殊设置的情况下,phpExcel将读取的单元格信息保存在内存中,我们可以通过 PHPExcel_Settings::setCacheStorageMethod() 来设置 ...

  8. php 封装memcache类

    <?php /*  * memcache类   */ class Memcacheds{     //声明静态成员变量     private static $m = null;     pri ...

  9. vue的安装以及语法介绍

    #需要用到一个vue文件,还有一个自己的js文件main.js<!DOCTYPE html> <html lang="en"> <head> & ...

  10. 手把手编写自己的PHPMVC框架

    1 什么是MVC MVC模式(Model-View-Controller)是软件工程中的一种软件架构模式,把软件系统分为三个基本部分:模型(Model).视图(View)和控制器(Controller ...