Hungary - The Atomic Era (Cinege, cinege)

马黑黑 · 发表于 2026-2-23 19:45

请马上登录，朋友们都在花潮里等着你哦：）

您需要登录才可以下载或查看，没有账号？立即注册

x

马黑黑 · 发表于 2026-2-23 19:46

帖子代码

<style>
@import 'https://638183.freep.cn/638183/web/tz/tz.v5.css';
.pa { --bg: url('https://638183.freep.cn/638183/t24/6/hungary.jpg') no-repeat center/cover; --ma-size: 12%;}
.vid { width: 10vw; height: 10vw; border-radius: 50%; mix-blend-mode: screen; box-shadow: 5px 5px 10px white, -5px -5px 10px yellow; }
</style>
<div id="tzbrother"></div>
<div id="tzcontainer">
<div class="pa"></div>
</div>
<script type="module">
import TZ from 'https://638183.freep.cn/638183/web/tz/tz.v5.js?v=1';
const tz = TZ.TZ('pa');
tz.add('audio', '', '', { src: 'https://music.163.com/song/media/outer/url?id=1969513370' });
tz.add('video', '', 'pd-vid', { src: 'https://img.tukuppt.com/video_show/2629112/00/01/92/5b4da1137698b.mp4' });
tz.add('video', '', 'vid ma', {
disablePictureInPicture: 'true',
src: 'https://img.tukuppt.com/video_show/2475824/00/08/40/5d21b5cc1237c.mp4'
}).playmp3();
tz.bgprog().style('bottom: 20px; color: #fefefe; width: 240px;');
tz.fs().style('right: 20px; top: 20px;');
tz.autoMid();
</script>

复制代码

马黑黑 · 发表于 2026-2-23 19:51

CSS 变量 --ma-size（03行）可以不保留，因为视频小播（04行）重新规定了小播的尺寸。

视频小播同时使用两个 class，.vid 和 .ma（19行），ma 带来的效果是旋转以及鼠标指针样式。需要注意的是，.ma 选择器作用于视频很多层面受限，所以，.vid 的设置必不可少。tz.v5.css 层叠样式文档已经集成有 .vid 设置，帖子中只需设置必要的属性（以覆盖或重设相关属性值）。

马黑黑 · 发表于 2026-2-23 20:00

tz.v5 模块通过反复测试，现在应该进入优化阶段。由于测试环境有限，慢网环境下它的表现无从了解。花潮不快不慢，个人感觉v5的测试效果过得去。

极速打开本帖相同内容请访问：Hungary - The Atomic Era (Cinege, cinege)

可以对二者进行比较，以感知不同网络主机环境下 v5 的自居中性能。

我自己搭建有本地论坛（局域网论坛），v5 的自居中标签非常优秀。

一切都有关联，理论上的东东在现实世界会因为环境的细节不同而产生不同的效应。