iOS wkwebkit 播放HTML5 视频 全屏问题解决

2018-03-05 11:30:04

使用html5 的video标签播放视频的时候，限制视频的尺寸，在android上是没有问题的，但是在ios上发现，视频没有开始播放的时候还是好的，但是一旦播放开是，就会全屏，非常奇怪。

    <video id="video" width="100%" poster="images/video.jpg" preload width="100%" controls>
    <source type="video/mp4" src="sex8.mp4" >
    </video>123

在一篇博客中发现解决方案如下： 
http://www.cocoachina.com/bbs/read.php?tid=107728

HTML里video必须加上webkit-playsinline属性
<video id="player" width="480" height="320" webkit-playsinline>
Obj-C里，webview设置allowsInlineMediaPlayback属性为YESwebview.allowsInlineMediaPlayback = YES;1234

经过尝试发现果然好用

html代码如下：

 <video id="video" width="100%" poster="images/video.jpg" preload width="100%" controls webkit-playsinline>
 <source type="video/mp4" src="sex8.mp4" >
 </video>123

objective-c 代码如下：

  config.allowsInlineMediaPlayback = YES;

  • 精彩推荐

  • 2019-01-29 14:50:51

    Node.js 编写跨平台 spawn 语句

    Node.js 是跨平台的，也就是说它能运行在 Windows、OSX 和 Linux 平台上。很多 Node.js 开发者都是在 OSX 上做开发的，然后再将代码部署到 Linux 服务器上。由于 OSX 和 Linux 都是基于 Unix 的，因此两者共性很多。Windows 也是 Node.js 官方支持的平台，只要你通过正确的方式写代码，就能在各个平台上毫无压力的跑起来。

  • 2019-01-30 17:53:21

    视图与临时表

    视图与表的不同之处：视图是一个虚表，即视图所对应的数据不进行实际存储，数据库只存储视图的定义，对视图的数据进行操作时，系统根据视图的定义去操作与视图相关联的基本表。

  • 2019-02-01 08:43:59

    JS 随机排序算法

    使用JS编写一个方法 让数组中的元素每次刷新随机排列

  • 2019-02-12 16:36:23

    图片工具GraphicsMagick的安装配置与基本使用

    GraphicsMagick是一个短小精悍的的图片处理工具和库集合。对于Java开发者来说，常用的图片处理工具有3个，JDK自带的图片处理库，ImageMagick，GraphicsMagick。JDK自带的图片处理库，虽稳定简单，性能却比较差；ImageMagick是目前最流行的图片处理工具，它的功能非常丰富；GraphicsMagick的功能略逊于ImageMagick，但是它的效率更强悍，但大多数情况下，GM的功能已经足够使用了。