Kfox Player SDK

Kfox Player SDK 是一个用于播放 .kfox 讲题动画的 JavaScript 库,可轻松集成到任何网页应用中。

SDK支持现代浏览器,包括Chrome、Firefox、Safari和Edge。

快速开始

1. 引入依赖

<!-- 必需的依赖库 -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.16.8/katex.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.16.8/katex.min.css">

<!-- Kfox Player SDK -->
<script src="./kfox-player.mini.js"></script>

2. 基本使用

<div id="kfox-player"></div>

<script>
const player = new KfoxPlayer({
    container: '#kfox-player',
    width: 896,
    height: 414,
    autoplay: false,
    controls: true,
    showSubtitle: true
});

// 加载并播放
player.load('./content.kfox')
    .then(() => player.play())
    .catch(error => console.error('加载失败:', error));
</script>

API参考

构造函数

new KfoxPlayer(options)

参数选项

参数 类型 默认值 说明
container string - 播放器容器选择器
width number 896 播放器宽度
height number 414 播放器高度
autoplay boolean false 是否自动播放
controls boolean true 是否显示控制栏
showSubtitle boolean true 是否显示字幕

方法

load(src)

加载kfox文件

返回: Promise

play()

开始播放

返回: void

pause()

暂停播放

返回: void

stop()

停止播放

返回: void

destroy()

销毁播放器实例

返回: void

事件

使用 player.on(event, callback) 监听事件:

loadStart

开始加载文件时触发

loadComplete

文件加载完成时触发

play

开始播放时触发

pause

暂停播放时触发

error

发生错误时触发

示例

完整示例

// 创建播放器实例
const player = new KfoxPlayer({
    container: '#player-container',
    width: 896,
    height: 414,
    autoplay: true,
    controls: true,
    showSubtitle: true
});

// 监听事件
player.on('loadStart', (src) => {
    console.log('开始加载:', src);
});

player.on('loadComplete', (data) => {
    console.log('加载完成:', data);
});

player.on('play', () => {
    console.log('开始播放');
});

player.on('error', (error) => {
    console.error('播放错误:', error);
});

// 加载并播放
player.load('path/to/your/content.kfox');