今天做一个app时发现一个问题,应用html5中的video标签加载视频,在Android手机上默认播放大小,但是换成iPhone手机上出问题了,默认弹出全屏播放,查找了好多论坛,都没有谈论这个的。然后几经波折终于找到其解决的方法了,在video标签下的source中加入这个-webkit-playsinline=true完美解决全屏问题。

例如:

<video width="100%" loop="loop" autoplay>
  <source type="video/mp4" src="data:images/xnps.mp4" -webkit-playsinline=true>
</video>

HTML5新标签video在iOS上默认全屏播放的更多相关文章

  1. html-----vedio标签(HTML5新标签VIDEO在IOS上默认全屏播放)

    今天做一个app时发现一个问题,应用html5中的video标签加载视频,在Android手机上默认播放大小,但是换成iPhone手机上出问题了,默认弹出全屏播放,查找了好多论坛,都没有谈论这个的.然 ...

  2. video 安卓ios系统 浏览器 全屏播放以及自动播放的问题

    ios自动播放 <body onload="load()"> <div class="result_box"> <div clas ...

  3. MUI ios下用video标签默认全屏播放

    前几天用Hbuilder+MUI做了个应用,里边用到<video>标签,在Android下正常,但是在苹果手机老是默认全屏播放. 解决办法: 首先在video标签加上playsinline ...

  4. 微信内置浏览器在使用video标签时(安卓)默认全屏的原因及解决办法

    根据X5论坛得到的答案是:设计如此. 腾讯真是越来越嚣张了,一家独大后用户体验都不注重了(不给程序员留活路). 听说有个申请加入vdeo白名单的,域名验证后就可以解决默认全屏(反正我是没见过申请入口, ...

  5. iOS APP 中H5视频默认全屏播放问题解决

    问题描述:在Android中,视频可以正常在H5页面局部播放,iOS中则自动切换至全屏模式. 查看资料得以解决,20190301记录下来. 解决方法:IOS10及以后,在 video标签页中只包含 w ...

  6. 【HTML5】如何处理HTML5新标签的浏览器兼容版问题

    HTML5规范毕竟是刚刚才定义完成的规范,还有一些浏览器并不能支持其中的新标签和新属性,尤其是IE8及以下版本浏览器.以下介绍一些在页面中使用HTML5新标签的实践方法,目的是让HTML5中的新标签在 ...

  7. 让ie浏览器支持html5新标签的解决方法(使用html5shiv)

    没估计错的话旧版浏览器都是不识别这些新增的标签所以都是用行内元素来处理解决的,所以,有一个解决办法的突破口就是让它变成块状元素就不会处于同一行了,这样在新旧浏览器都是可以显示同样的效果,再者就是让浏览 ...

  8. html5有哪些新特性、移除了那些元素?如何处理HTML5新标签的浏览器兼容问题?如何区分 HTML 和 HTML5?

    * HTML5 现在已经不是 SGML(标准通用标记语言,是一种定义电子文档结构和描述其内容的国际标准语言) 的子集,主要是关于图像,位置,存储,多任务等功能的增加.   * 拖拽释放(Drag an ...

  9. Html5新标签解释及用法

    Html5新标签解释及用法 HTML 5 是一个新的网络标准,目标在于取代现有的 HTML 4.01, XHTML 1.0 and DOM Level 2 HTML 标准.它希望能够减少浏览器对于需要 ...

随机推荐

  1. Android中的Keyevent

    使用Adb shell command直接送key event給Android adb shell input keyevent 7 # for key '0' adb shell input key ...

  2. TPCH Benchmark with Impala

    1. 生成测试数据在TPC-H的官网http://www.tpc.org/tpch/上下载dbgen工具,生成数据http://www.tpc.org/tpch/spec/tpch_2_17_0.zi ...

  3. Also unsere eigene Christian Louboutin Webshop bietet die überragende Christian Louboutin Schuhe uk schiebt zusammen mit kostengünstigen Wert

    www.heelschuhe.de, Es ist wirklich eine der Frauen erfordern immer interessant und auch Louboutin Pu ...

  4. Titanium studio安装

    在Win7 Titanium Studio的安装过程. 1.准备工作 Titanium存储空间的要求,Titanium Studio 需要1 GB.Android SDK需要1.5 GB.Blackb ...

  5. cocoapods无法使用(mac os 10.11升级导致pod: command not found)

    之前安装了cocoapods, 那么输入 : sudo gem install -n /usr/local/bin cocoapods 如果还不行的话 首先在终端输入 gem sources -l 查 ...

  6. jqzoom与scrollpic配合的问题

    <script type="text/javascript"> //以下两个方法的执行顺序不能互换,否则zoom方法的单击缩略图事件会失效 if (document.a ...

  7. HighChats图表控件显示精度小数点的方法

    相信大家对highchats这个图表控件并不陌生,最近在项目中用到它,但是某些字段需要显示为小数点,顾查找资料文档发现下面两个方式可以实现: 初始化时候添加如下两个参数 tooltip:{    fo ...

  8. 在WPF中获取DataGridTemplateColumn模板定义的内容控件

    xaml格式描述: <DataGrid Name="dataGrid" Grid.Row="1" ItemsSource="{Binding}& ...

  9. ios安装app提示【未受信任的企业级开发者】。在设置中信任此开发者

     最近在测试app,ios安装app后点击提示如下图: 解决方法: 1 点击 [设置] >[通用] >[设备管理]   2 点击企业级应用 > 信任该开发者 > 信任.设置之后 ...

  10. Android AsyncTask异步任务(二)

    之前我们讲过了AsyncTask 的生命周期(onPreExecute-->doInBackground-->onProgressUpdate-->onPostExecute),今天 ...