花简静贴子代码及说明汇总（翻页有新贴）

花简静

花简静

1. <style>
   
2.     @import 'https://638183.freep.cn/638183/web/tz/tz.v3.css';
   
3.     .pa { --offsetX: 0px; margin:150px 0; left: calc(50% - 101px);width: clamp(600px, 90vw, 1700px); height: auto; aspect-ratio: 18/9.6;background: url('https://cccimg.com/view.php/cc5ca7ac8d50e02342949b60b5afd58e.jpg') no-repeat center/cover; }
   
4.     .son { width: 75px; height: 100px; background: url('https://cccimg.com/view.php/892ae4f71fcf9e8cc28b64b1a4f1185b.png') no-repeat 50% 0/50% 50%; }
   
5.     .pd-vid  {mix-blend-mode:overlay;width:100%; -webkit-mask: linear-gradient(to top left, red 80%, transparent 0);opacity: .50;}
   
6. </style>
   
7. 
   
8. <div id="pa" class="pa"></div>
   
9. 
   
10. <script type="module">
    
11.     import TZ from 'https://638183.freep.cn/638183/web/tz/tz.v3.js';
    
12.     const tz = TZ.TZ('pa');
    
13.     tz.add('audio', '', '', {src: 'https://music.163.com/song/media/outer/url?id=19292767'});
    
14.     tz.add('video', '', 'pd-vid', {src: 'https://bpic.588ku.com/video_listen/588ku_preview/24/11/07/17/25/38/video672c8792ca029.mp4',style: 'mix-blend-mode: screen;right:-11%;'});
    
15.     tz.add('div', 'player', 'wrap100 hue-rotate rotate-ani', {style: 'cursor: pointer'}).playmp3();
    
16.     tz.lzRot(6, 'player', {className: 'son'}).style('right: 8%; bottom: 26%;opacity: .50;');
    
17.     tz.fs().style('right: 20px; bottom: 20px');
    
18. </script>

复制代码

花简静