play 全屏播放 方式1:URL 链接 APP开发接入视立方播放器
用做网页的技术做APP! 一门提供标准化的jsbridge-mini.js库,您只需要在页面引用并执行JS即可实现各种原生APP、原生PC的功能能力。 ==================APP端================== 【APP端】(安卓版&苹果版)目前提供200+原生功能,2000+JS映射接口,用做网站的技术即可实现各种原生APP能力、APP demo地址https://www.yimenapp.com/doc/demo.cshtml下载教程: ♦ JS-SDK 引用方式: ♦ 普通网页 script 方式加载:下载最新版,请在页面上调用 jsBridge 接口之前引用 jsbridge-mini.js 库; ♦ js module 方式引用:npm install ym-jsbridge 具体请参考 npm package |
核心代码示例,详情参阅demo
//方式1:URL 链接
jsBridge.txVideo.play({
url : 'http://player.alicdn.com/video/editor.mp4',
title : '方式1:URL 链接',
//数字,播放方式
//0 自动播放
//1 手动播放
//2 预加载
playAction : 0,
//字符串,封面图片链接
coverPictureUrl: "",
//json 对象,动态水印
water: {
//字符串,水印文字
text: "",
//文字大小
size: 30,
//文字颜色
color: "#80FFFFFF"
},
cutout: false,
keepOrientation: false,
loop: true
});
/*
参数说明
{
url : '', //必须,字符串类型,视频链接
title : '', //可选,字符串类型,视频名称,显示在 UI 上
qualityName : '', //可选,字符串类型,码率名称(如 标清/高清/超清/1080P/4K 等)
playAction : 0, //可选,数字类型,播放方式
coverPictureUrl : "", //可选,字符串类型,封面图片链接
water : //可选,json 类型,动态水印
cutout : '', //可选,布尔类型,是否保留刘海(凹凸屏)区域,默认 false 即不保留(视频会占用刘海区域)
keepOrientation : false //可选,布尔类型,是否保持当前屏幕方向(true 保持当前屏幕方向不变,false 切换为横屏),默认 false
loop : false //可选,布尔类型,是否循环播放,默认 false
}
以下 方式2、方式3 均支持 keepOrientation 和 loop 参数
*/
A标签执行JS示例代码
<a href="javascript:void(0)" onclick="zhixing()">执行</a>
<!-- 写入一个A标签href值为"javascript:void(0)",定义点击事件onclick;-->
<script src="您的服务器URL/jsbridge-mini.js"></script>
<!-- 在您的服务器引入一门JS地址,请下载jsbridge-mini.js上传您自己的服务器获取链接;-->
<script type="text/javascript">
function zhixing() {
<!--这里可以直接复制JS核心代码到此{}括号内-->
//方式1:URL 链接
jsBridge.txVideo.play({
url : 'http://player.alicdn.com/video/editor.mp4',
title : '方式1:URL 链接',
//数字,播放方式
//0 自动播放
//1 手动播放
//2 预加载
playAction : 0,
//字符串,封面图片链接
coverPictureUrl: "",
//json 对象,动态水印
water: {
//字符串,水印文字
text: "",
//文字大小
size: 30,
//文字颜色
color: "#80FFFFFF"
},
cutout: false,
keepOrientation: false,
loop: true
});
/*
参数说明
{
url : '', //必须,字符串类型,视频链接
title : '', //可选,字符串类型,视频名称,显示在 UI 上
qualityName : '', //可选,字符串类型,码率名称(如 标清/高清/超清/1080P/4K 等)
playAction : 0, //可选,数字类型,播放方式
coverPictureUrl : "", //可选,字符串类型,封面图片链接
water : //可选,json 类型,动态水印
cutout : '', //可选,布尔类型,是否保留刘海(凹凸屏)区域,默认 false 即不保留(视频会占用刘海区域)
keepOrientation : false //可选,布尔类型,是否保持当前屏幕方向(true 保持当前屏幕方向不变,false 切换为横屏),默认 false
loop : false //可选,布尔类型,是否循环播放,默认 false
}
以下 方式2、方式3 均支持 keepOrientation 和 loop 参数
*/
}
</script>
<!--执行核心代码;
//如果需要进入页面就执行,去掉点击事件即可;-->
按钮执行JS示例代码
<button onclick="zhixing()" >执行</button>
<!-- //写一个按钮,定义点击执行事件; -->
<script src="您的服务器URL/jsbridge-mini.js"></script>
<!-- //在您的服务器引入一门JS地址,请下载jsbridge-mini.js上传您自己的服务器获取链接; -->
<script type="text/javascript">
function zhixing() {
<!--这里可以直接复制JS核心代码到此{}括号内-->
//方式1:URL 链接
jsBridge.txVideo.play({
url : 'http://player.alicdn.com/video/editor.mp4',
title : '方式1:URL 链接',
//数字,播放方式
//0 自动播放
//1 手动播放
//2 预加载
playAction : 0,
//字符串,封面图片链接
coverPictureUrl: "",
//json 对象,动态水印
water: {
//字符串,水印文字
text: "",
//文字大小
size: 30,
//文字颜色
color: "#80FFFFFF"
},
cutout: false,
keepOrientation: false,
loop: true
});
/*
参数说明
{
url : '', //必须,字符串类型,视频链接
title : '', //可选,字符串类型,视频名称,显示在 UI 上
qualityName : '', //可选,字符串类型,码率名称(如 标清/高清/超清/1080P/4K 等)
playAction : 0, //可选,数字类型,播放方式
coverPictureUrl : "", //可选,字符串类型,封面图片链接
water : //可选,json 类型,动态水印
cutout : '', //可选,布尔类型,是否保留刘海(凹凸屏)区域,默认 false 即不保留(视频会占用刘海区域)
keepOrientation : false //可选,布尔类型,是否保持当前屏幕方向(true 保持当前屏幕方向不变,false 切换为横屏),默认 false
loop : false //可选,布尔类型,是否循环播放,默认 false
}
以下 方式2、方式3 均支持 keepOrientation 和 loop 参数
*/
}
</script>
<!-- //执行核心代码;
//如果需要进入页面就执行,去掉点击事件即可; -->
编辑:yimen,如若转载,请注明出处:https://www.yimenapp.com/kb-yimen/13952/
部分内容来自网络投稿,如有侵权联系立删