网站添加在线随机小姐姐跳舞视频

将下方代码复制粘贴到你自己的网站需要展示的地方即可，也可以文章页面。视频来自外部网站，失效后自行替换接口。

侧栏效果演示

浅色主题效果：

深色主题效果：

以下是完整的代码（代码已升级按钮内置，可看博客最新效果）

<div id="video-container">
    <video id="player" src="https://dy.mn.cyou/videoapi.php" autoplay muted playsinline></video>

    <div id="buttons">
        <button id="switch">连续: 开</button>
        <button id="next1">开盲盒</button>
        <button id="mute">静音</button>
    </div>
</div>

<script>
(function (window, document) {
    if (top != self) {
        window.top.location.replace(self.location.href);
    }

    const get = (id) => document.getElementById(id);
    const bind = (el, ev, cb) => el.addEventListener(ev, cb);

    let auto = true;
    const player = get('player');

    // 切换视频
    const randomm = () => {
        player.src = 'http://v.nrzj.vip/video.php?_t=' + Math.random();
        player.play();
    };

    // 按钮事件绑定
    bind(get('next1'), 'click', randomm);
    bind(player, 'error', randomm);
    bind(get('switch'), 'click', function () {
        auto = !auto;
        this.innerText = '连续: ' + (auto ? '开' : '关');
    });
    bind(get('mute'), 'click', function () {
        player.muted = !player.muted;
        this.innerText = player.muted ? '静音' : '有声';
    });
    bind(player, 'ended', function () {
        if (auto) randomm();
    });
})(window, document);
</script>

<style>
/* 外层容器 */
#video-container {
    position: relative;
    width: 100%;
    height: 500px;
    overflow: hidden;
    border-radius: 8px; /* 保留圆角 */
    background: #000;
}

/* 视频样式，使用 clip-path 抗锯齿 */
#player {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    transform: translate(-50%, -50%) translateZ(0); /* GPU 加速 */
    object-fit: cover;
    clip-path: inset(0 round 8px); /* 平滑圆角 */
    backface-visibility: hidden; /* 改善抗锯齿 */
}

/* 按钮容器，居中显示 */
#buttons {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
    opacity: 0;
    transition: opacity 0.4s;
}

/* 鼠标移入显示按钮 */
#video-container:hover #buttons {
    opacity: 1;
}

/* 按钮样式 */
#switch, #next1, #mute {
    background: rgba(251,108,40,0.9);
    color: #fff;
    line-height: 36px;
    text-align: center;
    width: 90px;
    border: none;
    border-radius: 20px;
    font-weight: bold;
    cursor: pointer;
    transition: background 0.3s;
    font-size: 14px;
}

#switch:hover, #next1:hover, #mute:hover {
    background: #ff7b3d;
}
</style>

再提供个接口：
http://v.nrzj.vip/video.php?_t=
https://api.178v.cn/api/sjkssp/api.php?apikey=f643cdbe-7639-2e1b-a634-e13ded5a13f5d9183623