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 ...
随机推荐
- Regex分组与Pattern正则表达式对象
1.正则规则: 1.String regex = "[1-9]" 表示单个字符的取值范围是 1~9,注意是单个字符的取值范围 2 ...
- maven 打包构建相关命令
1.命令 mvn clean package 依次执行clean.resources.compile.testResources.testCompile.test.jar(打包)等7个阶段. mvn ...
- jenkins构建项目时报错缺少com.sun.image.codec.jpeg包解决方案
错误日志:error: package com.sun.image.codec.jpeg does not exist 网上找的一个项目,使用的是jdk1.7,除此之外其他服务器配置或是环境配置都是j ...
- Tornado基础学习篇
1.1 Tornado是什么? Tornado是使用Python编写的一个强大的.可扩展的Web服务器.它在处理严峻的网络流量时表现得足够强健,但却在创建和编写时有着足够的轻量级,并能够被用在大量的应 ...
- .Net Core 商城微服务项目系列(十二):使用k8s部署商城服务
一.简介 本篇我们将会把商城的服务部署到k8s中,同时变化的还有以下两个地方: 1.不再使用Consul做服务的注册和发现,转而使用k8s-dns来实现. 2.不再使用Ocelot作为业务网关,使用T ...
- Linux下几种常见压缩方式测试对比
目录 Linux下几种常见压缩方式测试对比 参考 简介 测试 总结 Linux下几种常见压缩方式测试对比
- Shell之Test命令
目录 Shell之Test命令 参考 Test简介 Test语法 表达式之逻辑运算 表达式之字符串判断 表达式之整数判断 表达式之文件判断 Shell之Test命令
- RDD基础-笔记
RDD编程 基础Spark中的RDD是一个不可变的分布式对象集合.每个RDD都被分为多个分区,这些分区运行在集群中的不同节点上.RDD可以包含Python.java.Scala中任意类型的对象,甚至可 ...
- Android开发——RecyclerView实现下载列表
本篇记录的是使用Jsoup框架爬取网页内容,结合Android的RecyclerView,从而实现批量下载小说的功能(也是我的APP星之小说下载器Android版的核心功能),思路仅供参考 本文使用了 ...
- 购买https证书以及nginx配置https
文章来源 运维公会:购买https证书以及nginx配置https 1.https的作用 https的全名是安全超文本传输协议,是在http的基础上增加了ssl加密协议.在信息传输的过程中,信息有可能 ...