ckplayer

 找回密码
 立即注册

QQ登录

只需一步,快速开始

查看: 1395|回复: 3

网页拖动时自动切换到右下角播放

[复制链接]

4

主题

11

帖子

32

积分

新手上路

Rank: 1

积分
32
发表于 2022-3-27 16:57:38 | 显示全部楼层 |阅读模式
很高兴看到X3支持了画中画功能,但现在需要自己点击按钮才会到右下角播放,现在希望能够在某页内容较多时,当显示内容不包括视频时能自动切换到右下角播放。
回复

使用道具 举报

4

主题

11

帖子

32

积分

新手上路

Rank: 1

积分
32
 楼主| 发表于 2022-3-27 17:10:29 | 显示全部楼层
呵呵,刚刚看了官网的全功能演示,发现直接就支持这个功能。经过研究,原来是播放器中要打开小窗口模式。
回复

使用道具 举报

10

主题

170

帖子

989

积分

超级版主

Rank: 8Rank: 8

积分
989
发表于 2022-3-27 17:20:56 | 显示全部楼层
感谢您对ckplayer的支持,祝愿贵站流量大涨。
回复

使用道具 举报

5

主题

27

帖子

91

积分

注册会员

Rank: 2

积分
91
发表于 2022-3-29 02:24:37 | 显示全部楼层
本帖最后由 夕幽幽 于 2022-3-29 15:10 编辑

ckplayer 的小窗口 功能的确很赞!
video 有H5  画中画接口:

1  JS文件(放在页面末尾)var video = document.getElementById("picture_id");
var btn_in = document.getElementById("pic_in");
var btn_out = document.getElementById("pic_out");
btn_in.onclick = function(){javascript:document.getElementById('pic_out').style.display='block';this.style.display='none';video.requestPictureInPicture();}
btn_out.onclick = function(){javascript:document.getElementById('pic_in').style.display='block';this.style.display='none';document.exitPictureInPicture();}        
video.addEventListener('enterpictureinpicture', function() {console.log("已经进入画中画")});
video.addEventListener('leavepictureinpicture', function() {console.log("已退出画中画模式")});

2  在前端合适位置添加切换按钮<input type="button" id="pic_in" value="开" style="padding:4px 8px;border: 1px solid #264099;border-radius:100%;background:#264099;color:#ffffff;cursor:pointer;" title="开启画中画" />
<input type="button" id="pic_out"  value="关" style="padding:4px 8px;border: 1px solid #2986C6;border-radius:50%;background:#2986C6;color:#ffffff;cursor:pointer;display:none;" title="退出画中画" />
3 在ckplayer.js中的video标签中添加 id="picture_id"




本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

x
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

快速回复 返回顶部 返回列表