video2

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <style type="text/css">

            .div2{

                width: 500px;

                height: 500px;

                background: #87CEEB;

            }

        </style>

    </head>

    <body>

        <video width="600" height="" src="img/shiping.mp4" poster="img/timg.jpg" controls="controls"></video>

         <button>播放</button>

         <button class="fullscreen">全屏</button>

         <img src="img/timg.jpg"/>

         <div class="div2">

             <h1>wxihuanni</h1>

         </div>

         <script type="text/javascript">

             var v1=document.querySelector('video')

             document.querySelector('button').onclick=function(){

                 v1.play()

             }

              document.querySelector('.fullscreen').onclick=function(){

                  v1.webkitRequestFullScreen()

              }

             document.querySelector('img').onclick=function(){

                 document.querySelector('img').webkitRequestFullScreen()

             }

             document.querySelector('.div2').onclick=function(){

                 document.querySelector('.div2').webkitRequestFullScreen()

             }

         </script>g

    </body>

</html>

video2的更多相关文章

HTML5- Canvas入门（五）
今天要介绍的是canvas对图形对象的操作,包括图像.视频绘制,和操作像素对象的方法. 图片/视频的绘制在canvas中,我们可以通过 drawImage() 的方法来绘制图片或视频文件,其语法为: ...
MediaElement.js之浏览器跨域请求视频播放
浏览器跨域问题一直以来都是作为前端开发人员常见的问题,所以今天学习了下如何使浏览器跨域请求资源需要了解的知识 -域(主域,子域,什么是跨域) 简单来说由于浏览器同源策略,凡是发送请求url的协议(h ...
【django】京东等大型网站的混合搜索是怎么实现的？
混合搜索在各大网站如京东.淘宝都有应用,他们的原理都是什么呢?本博文将为你介绍它们的实现过程. 混合搜索的原理,用一句话来说就是:关键字id进行拼接. 混合搜索示例: 数据库设计: 视频方向: cla ...
laravel框架总结(十二) -- 关联关系
这里我们users表对应的模型类名是users,大家特意注意下和user取名的不同 1.一对一关系 1>表A和表B的记录一一对应,比如一个用户对应一个社交账号数据表的设计如下: 2> ...
C# 字符串操作类
using System; using System.Collections.Generic; using System.Text; using System.Collections; using S ...
PR视屏剪切
一款常用的视频编辑软件,由Adobe公司推出.现在常用的有CS4.CS5.CS6.CC.CC 2014及CC 2015版本.是一款编辑画面质量比较好的软件,有较好的兼容性,且可以与Adobe公司推出的 ...
(转) Deep Learning Resources
转自:http://www.jeremydjacksonphd.com/category/deep-learning/ Deep Learning Resources Posted on May 13 ...
Shell文本处理 - 分割合并与过滤
sort分类操作示例文件 Boys in Company C:HK:192:2192 Alien:HK:119:1982 The Hill:KL:63:2972 Aliens:HK:532:4892 ...
手势估计- Hand Pose Estimation
http://blog.csdn.net/myarrow/article/details/51933651 1. 目前进展 1.1 相关资料 1)HANDS CVPR 2016 2 ...

随机推荐

Scrapy项目 - 数据简析 - 实现斗鱼直播网站信息爬取的爬虫设计
一.数据分析截图(weka数据分析截图 2-3个图,作业文字描述) 本次将所爬取的数据信息,如:房间数,直播类别和人气,导入Weka 3.7工具进行数据分析.有关本次的数据分析详情详见下图所示: ...
Robot Framework自定义测试库的作用域的理解
robot framework中,强大的测试库api支持,用户可根据实际需求定义测试库,导入后可使用自定义库中相应的关键字. 当自定义的测试库是类库,则需要考虑一个问题:类实例.用类实现的库可以有内部 ...
layui table异步调用数据的时候，数据展示不出来现象解决方案
最近使用layui table进行异步获取数据并填充的时候,控制台打印出数据长度为0,但是其中还有数据,网上找了很多办法,下边是我最后使用的. 一般,render渲染表格是独立的书写格式,但是我在做数 ...
电脑链接WiFi有网络不能上网问题
刚刚入手了一个小米book pro笔记本突然发现网络链接了,但是却上不了网.找了n种方法,最后发现问题在于电脑的网络适配器中的无线模式出现了问题,下面开始解决方案的详细步骤说明. 一 . 打开电脑管理 ...
Kubernetes 系列（八）：搭建EFK日志收集系统
Kubernetes 中比较流行的日志收集解决方案是 Elasticsearch.Fluentd 和 Kibana(EFK)技术栈,也是官方现在比较推荐的一种方案. Elasticsearch 是一个 ...
linux目录化结构
初学Linux,首先需要弄清Linux 标准目录结构 / root --- 启动Linux时使用的一些核心文件.如操作系统内核.引导程序Grub等. home --- 存储普通用户的个人文件 ftp ...
安装sublime插件安装不上遇到的各种坑
为了学习VUE , 发现没有高亮代码, 百度原来需要安装插件,安装过程中遇到了各种坑,记录下来避免大家踩坑, 首先用代码安装快捷键 ctrl+` 粘贴代码 import urllib.reque ...
MySQL8身份验证问题解决
开新项目.使用MySQL8,在经历过B级别的网速下载后,终于安装好了MySQL,虽然在终端上是可以直接登录的. 但是我使用Navicat就无法访问了,提示什么登录失败,还有乱码. 搜索了一下,发现是M ...
mysql 分页offset过大性能问题解决思路
在公司干活一般使用sqlserver数据库.rownumber分页贼好用. 但是晚上下班搞自己的事情就不用sqlserver了.原因就是自己的渣渣1核2g的小服务器完全扛不住sqlserver那么大的 ...
Huffman树及其编解码
Huffman树--编解码介绍: Huffman树可以根据输入的字符串中某个字符出现的次数来给某个字符设定一个权值,然后可以根据权值的大小给一个给定的字符串编码,或者对一串编码进行解码,可以用于 ...

video2

video2的更多相关文章

随机推荐

热门专题