html, body {
margin: 0;
padding: 0;
background-color: #fff;
font-family: sans-serif;
}
.player-wrapper {
width: 100%;
max-width: 720px;
margin: 0 auto;
background-color: #000;
position: relative;
}
#videojs-player {
width: 100%;
height: auto;
aspect-ratio: 16 / 9;
background-color: #000;
}
.poster-overlay {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 40%;
padding-top: 25%;
background: url("https://www.letutk.com/playerposter.jpg") center center / cover no-repeat;
z-index: 10;
cursor: pointer;
transition: opacity 0.3s;
}
.poster-overlay.hidden {
opacity: 0;
pointer-events: none;
}
const videoUrl = "https://cdn.tkletu.xyz/Video by José Gutiérrez [879137600_456240967].mp4";
const posterOverlay = document.getElementById("poster-overlay");
const videoEl = document.getElementById("videojs-player");
const player = videojs(videoEl, {
autoplay: true,
muted: true,
playsinline: true
});
player.ready(() => {
player.src({ src: videoUrl, type: "video/mp4" });
player.play().catch(err => console.warn("自动播放失败：", err));
player.on("canplay", () => posterOverlay.classList.add("hidden"));
player.on("playing", () => posterOverlay.classList.add("hidden"));
player.on("pause", () => {
if (!player.ended()) posterOverlay.classList.remove("hidden");
});
player.on("ended", () => posterOverlay.classList.add("hidden"));
videoEl.addEventListener("dblclick", () => {
if (document.fullscreenElement) {
document.exitFullscreen();
} else {
videoEl.requestFullscreen().catch(err => console.warn("全屏失败：", err));
}
});
posterOverlay.addEventListener("click", () => {
if (player.paused()) {
window.location.href = "https://www.letutk.com";
}
});
});
player.on("error", () => {
console.error("Video.js 播放错误");
posterOverlay.style.display = "block";
alert("视频播放失败，请重试");
});