前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >Model层视频播放关闭问题及手机视频播放的适配问题解决方案

Model层视频播放关闭问题及手机视频播放的适配问题解决方案

作者头像
lilugirl
发布于 2019-05-26 12:36:37
发布于 2019-05-26 12:36:37
82500
代码可运行
举报
文章被收录于专栏:前端导学前端导学
运行总次数:0
代码可运行
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
$("#modal-video .close").on("click", function () {
    $("#modal-video iframe").attr("src", $("#modal-video iframe").attr("src"));

  

});

$(function(){
	 if(screen.width<768 ){
   // alert("这是手机");
    if(document.body.clientWidth>window.screen.width){
    /// alert("屏幕是横着放的");
	$("#modal-video iframe").attr("width", 500);
	$("#modal-video iframe").attr("height",310);
	
	
    }else{
     // alert("屏幕是竖着放的");
	 $("#modal-video iframe").attr("width", 260);
	 $("#modal-video iframe").attr("height",160);
    }

  }

});
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
根据屏幕尺寸重写iframe中video的尺寸-当页面需要全部加载后才能判断的情况
代码实例 function sleepcheckvideo(){ // alert('here is a function'); setTimeout(function() {
lilugirl
2019/05/26
1.6K0
移动站Web开发图片自适应两种常见情况解决方案
  本文主要说的是Web中图片根据手机屏幕大小自适应居中显示,图片自适应两种常见情况解决方案。开始吧
全栈程序员站长
2022/07/09
6830
js获得浏览器高度和宽度 参数
document.documentElement.clientHeight -->浏览器的高度
botkenni
2019/09/03
6.7K0
Swiper滑动Html5手机浏览器自适应
手机网页能通过window.screen.height, width获取屏幕分辨率,于是能够通过分辨率比率来计算高度。
全栈程序员站长
2022/07/08
1.6K0
Swiper滑动Html5手机浏览器自适应
通过Js来获取所有屏幕分辨率的总结
通过Js来获取所有屏幕适配的总结 <script type="text/javascript">     window.οnlοad=function(){     //document.getElementById("test").style.height="200px";     //document.getElementsByTagName('div')[0].offsetHeight='600px';     document.getElementsByTagName('div')
White feathe
2021/12/08
4.3K0
js获取屏幕大小,当前网页和浏览器窗口
如果您使用的是jQuery,则可以使用jQuery方法获取窗口或document的大小:
IT工作者
2022/01/25
13.3K0
javascript 获取多种主流浏览器显示页面高度(转)
IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.documentElement.clientWidth ==> 可见区域宽度 document.documentElement.clientHeight ==> 可见区域高度 FireFox中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.documentElement.clientWidth ==> 可见区域宽度 document.documentElement.clientHeight ==> 可见区域高度 Opera中:  document.body.clientWidth ==> 可见区域宽度 document.body.clientHeight ==> 可见区域高度 document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽) document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高) 没有定义W3C的标准,则 IE为: document.documentElement.clientWidth ==> 0 document.documentElement.clientHeight ==> 0 FireFox为: document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽)document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高) Opera为: document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽)document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高)
lin_zone
2018/08/15
1.1K0
JS常用代码块
版权声明:本文为博主原创文章,遵循 CC 4.0 by-sa 版权协议,转载请附上原文出处链接和本声明。
奋飛
2019/08/15
3.4K0
Js窗体window大小设置(转)
网页可见区域宽:document.body.offsetWidth (包括边线的宽) 
山河木马
2019/03/05
6.7K0
JS获取浏览器窗口大小 获取屏幕,浏览器,网页高度宽度(转)
网页可见区域宽:document.body.clientWidth  网页可见区域高:document.body.clientHeight  网页可见区域宽:document.body.offsetWidth (包括边线的宽)  网页可见区域高:document.body.offsetHeight (包括边线的宽)  网页正文全文宽:document.body.scrollWidth  网页正文全文高:document.body.scrollHeight  网页被卷去的高:document.body.scrollTop  网页被卷去的左:document.body.scrollLeft  网页正文部分上:window.screenTop  网页正文部分左:window.screenLeft  屏幕分辨率的高:window.screen.height  屏幕分辨率的宽:window.screen.width  屏幕可用工作区高度:window.screen.availHeight  屏幕可用工作区宽度:window.screen.availWidth  HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth  scrollHeight: 获取对象的滚动高度。  scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离  scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离  scrollWidth:获取对象的滚动宽度  offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度  offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置  offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置  event.clientX 相对文档的水平座标  event.clientY 相对文档的垂直座标  event.offsetX 相对容器的水平坐标  event.offsetY 相对容器的垂直坐标  document.documentElement.scrollTop 垂直方向滚动的值  event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量  IE,FireFox 差异如下:  IE6.0、FF1.06+:  clientWidth = width + padding  clientHeight = height + padding  offsetWidth = width + padding + border  offsetHeight = height + padding + border  IE5.0/5.5:  clientWidth = width - border  clientHeight = height - border  offsetWidth = width  offsetHeight = height  (需要提一下:CSS中的margin属性,与clientWidth、offsetWidth、clientHeight、offsetHeight均无关)
山河木马
2019/03/05
16.8K0
javascript基础-3
window.resizeBy(XX[px],YY[px]);——窗口尺寸变化的单位为:±XX,±YY (单位/px); window.resizeTo(XX[px],YY[px]);——窗口尺寸变换为:XX,YY(单位/px); window.scrollBy(XX[px],YY[px]);——屏幕滚动的单位为:±XX,±YY (单位/px); window.scrollToo(XX[px],YY[px]);———屏幕滚动到数据位置:XX,YY(单位/px); object.onscroll();onscroll事件:元素滚动时执行..; document.Element.scrollTop||document.body.scrollTop;回顶;
py3study
2020/01/13
1.2K0
JavaScript BOM学习
BOM的核心是window,它是一个浏览器的功能实例,浏览器会为HTML文档创建一个专属的window对象,并为每一个框架创建额外的window对象。 window对象是BOM的顶层,所有其他对象都是通过window对象衍生的;但是在调用子对象的时候并不强制要求声明
Mirror王宇阳
2020/11/12
9820
Electron音视频录制
获取设备的支持情况 var types = [ "video/webm", "audio/webm", "video/webm\;codecs=vp8", "video/webm\;codecs=daala", "video/webm\;codecs=h264", "audio/webm\;codecs=opus", "video/mpeg" ]; for (var i in types) { console.log(types[i] + ":" + (MediaRecorder.isT
码客说
2019/10/21
4.1K1
JS 获取浏览器窗口大小clientWidth、offsetWidth、scrollWidth「建议收藏」
在我本地测试当中: 在IE、FireFox、Opera下都可以使用 document.body.clientWidth document.body.clientHeight 即可获得,很简单,很方便。 而在公司项目当中: Opera仍然使用 document.body.clientWidth document.body.clientHeight 可是IE和FireFox则使用 document.documentElement.clientWidth document.documentElement.clientHeight 原来是W3C的标准在作怪啊
全栈程序员站长
2022/09/16
8.2K0
JS 获取浏览器窗口大小clientWidth、offsetWidth、scrollWidth「建议收藏」
jQuery实现图片懒加载
一、懒加载 1.什么是懒加载 目前,网络上各大论坛,尤其是一些图片类型的网站上,在图片加载时均采用了一种名为懒加载的方式,具体表现为,当页面被请求时,只加载可视区域的图片,其它部分的图片则不加载,只有这些图片出现在可视区域时才会动态加载这些图片,从而节约了网络带宽和提高了初次加载的速度。 2.懒加载的原理 页面中的img元素,如果没有src属性,浏览器就不会发出请求去下载图片,只有通过javascript设置了图片路径,浏览器才会发送请求。 懒加载的原理就是先在页面中把所有的图片统一使用一张占位图进行占位,
小胖
2018/06/27
14.4K0
移动端常见问题解决方案
通常当你在手机上长按图像 img ,会弹出选项 存储图像 或者 拷贝图像,若不想让用户这么操作,可以设置方法来禁止:
青梅煮码
2023/03/02
1.4K0
你是否有一个梦想?用JavaScript开发一款自定义配置视频播放器
沉寂了一周了,打算把这几天的结果呈现给大家。这几天抽空就一直在搞一个自定义视频播放器,为什么会有如此想法?是因为之前看一些学习视频网站时,看到它们做的视频播放器非常Nice!于是,就打算抽空开发一款属于自己的视频播放器。话不多说,一起来实战吧!
Vam的金豆之路
2021/12/01
1.1K0
你是否有一个梦想?用JavaScript开发一款自定义配置视频播放器
js 获取浏览器高度和宽度值(多浏览器)
IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.documentElement.clientWidth ==> 可见区域宽度 document.documentElement.clientHeight ==> 可见区域高度 FireFox中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.documentElement.clientWidth ==> 可见区域宽度 document.documentElement.clientHeight ==> 可见区域高度 Opera中: document.body.clientWidth ==> 可见区域宽度 document.body.clientHeight ==> 可见区域高度 document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽) document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高) 没有定义W3C的标准,则 IE为: document.documentElement.clientWidth ==> 0 document.documentElement.clientHeight ==> 0 FireFox为: document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽) document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高) Opera为: document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽) document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高)
似水的流年
2018/01/12
8.2K0
盘点JavaScript中那些进阶操作知识(下篇)
相信做网站对JavaScript再熟悉不过了,它是一门脚本语言,不同于Python的是,它是一门浏览器脚本语言,而Python则是服务器脚本语言,我们不光要会Python,还要会JavaScript,因为它对做网页方面是有很大作用的。
前端皮皮
2021/09/14
4660
从0到1搭建一款Vue可配置视频播放器组件(Npm已发布)
话不多说,这篇文章主要讲述如何从0到1搭建一款适用于Vue.js的自定义配置视频播放器。我们平时在PC端网站上观看视频时,会看到有很多丰富样式的视频播放器,而我们自己写的video标签样式却是那么丑。其实像那些网站都是基于原生video标签进行开发的,只不过还得适当加工一下,才会有我们所看到的漂亮的视频播放器。
Vam的金豆之路
2021/12/01
8480
从0到1搭建一款Vue可配置视频播放器组件(Npm已发布)
推荐阅读
相关推荐
根据屏幕尺寸重写iframe中video的尺寸-当页面需要全部加载后才能判断的情况
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验