1 · 引入脚本
<script src="heolivephoto.js" defer></script>
heolivephoto.js 地址：heolivephoto.js
2 · 写一个 img 标签
<img src="photo.pvt" alt="Live Photo">
3 · 完成
桌面悬浮左上角实况徽标从头播放，移出立即恢复图片；触屏设备长按播放，松手立即恢复图片。脚本会自动取回 .pvt 并解出封面与视频，覆盖在图片上，并继承图片的圆角，左上角带实况徽标。
src="photo.pvt" | .pvt 动态照片包（必需，合成页导出的文件） |
data-live-video | 可选：不用 .pvt 时，单独指定 MP4/MOV 视频地址 |
data-live-loop | 是否循环，默认只播一遍；设为 "true" 开启循环 |
data-live-badge | 左上实况徽标，默认按页面语言展示；设为 "false" 隐藏，也可自定义徽标文字 |
兼容 Apple 官方写法
<div data-live-photo
data-photo-src="cover.jpg"
data-video-src="motion.mp4"
style="width: 320px; height: 320px">
</div>
Apple LivePhotosKit 风格的 div 写法也能直接用：div 即播放框，填满给定尺寸；桌面悬浮徽标播放，触屏长按播放，触发逻辑与 img 写法一致。
洪绘Live图