找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 266|回复: 32

【音畫素材】全屏大圖自動切換

[复制链接]

314

主题

6442

回帖

3万

积分

版主

积分
36730
发表于 2024-10-31 16:00:34 | 显示全部楼层 |阅读模式 IP:辽宁
本帖最后由 闲云 于 2024-11-1 06:28 编辑


评分

参与人数 9金币 +80 收起 理由
童声韵灵 + 8 赞一个!
月婵 + 10 赞一个!
筱亭 + 8 赞一个!
微尘 + 8 赞一个!
西湖 + 10 赞一个!
山里娃 + 8 赞一个!
吴林海 + 8
风清 + 10 赞一个!
老谟深虑 + 10 赞一个!

查看全部评分

314

主题

6442

回帖

3万

积分

版主

积分
36730
 楼主| 发表于 2024-10-31 16:03:20 | 显示全部楼层 IP:辽宁
本帖最后由 闲云 于 2024-10-31 19:20 编辑

代码如下:
  1. <div style="position:absolute;z-index:32768;background:none;width:100%;left:-2px;margin-top:86px;">
  2. <style>
  3.   .container0 {
  4.   margin: 50px auto;
  5.   width: 1194px;box-shadow: 0px 0px 0px 2px #cccccc, 0px 0px 0px 14px #880000; overflow: hidden;
  6.   height: 620px;
  7. border: 1px solid;
  8. background: #333 url('https://pic.imgdb.cn/item/671ce499d29ded1a8c4a28e2.jpg') no-repeat center/cover; overflow: hidden;
  9.   position: relative;
  10. }
  11. .photo {
  12.   position: absolute;
  13. width: 100%;
  14.   height: 100%;transform: scale3d(0,0,-300) skew(0,60deg);
  15.   animation: round 32s infinite;
  16.   opacity: 0;
  17. }
  18. @keyframes round {
  19.   5% {opacity: 1;}
  20. 12% {opacity: 1;transform:  scale(1)}
  21. 18% {opacity: 0;transform:  scale(3)}
  22. }
  23. img:nth-child(1) {animation-delay: 28s;}
  24. img:nth-child(2) {animation-delay: 24s;}
  25. img:nth-child(3) {animation-delay: 20s;}
  26. img:nth-child(4) {animation-delay: 16s;}
  27. img:nth-child(5) {animation-delay: 12s;}
  28. img:nth-child(6) { animation-delay: 8s;}
  29. img:nth-child(7) {animation-delay: 4s;}
  30. img:nth-child(8) {animation-delay: 0s;}
  31.     </style>
  32. <div class="container0">
  33.   <img class="photo" src="https://pic.imgdb.cn/item/6720a0acd29ded1a8c1516d1.jpg" alt="">
  34.   <img class="photo" src="https://pic.imgdb.cn/item/6720a0acd29ded1a8c1516db.jpg" alt="">
  35.   <img class="photo" src="https://pic.imgdb.cn/item/6720a0acd29ded1a8c1516e8.jpg" alt="">
  36.   <img class="photo" src="https://pic.imgdb.cn/item/6720a0acd29ded1a8c1516f9.jpg" alt="">
  37. <img class="photo" src="https://pic.imgdb.cn/item/6720a0acd29ded1a8c151705.jpg" alt="">
  38. <img class="photo" src="https://pic.imgdb.cn/item/6720a0acd29ded1a8c151716.jpg" alt="">
  39. <img class="photo" src="https://pic.imgdb.cn/item/6720a0acd29ded1a8c151723.jpg" alt="">
  40. <img class="photo" src="https://pic.imgdb.cn/item/6720a0acd29ded1a8c151735.jpg" alt="">
  41. <div class="container">
  42.       <div class="btn">
  43. <span id="bf" onclick="bf();" style="width: 120px; height: 120px;z-index: 550;position: absolute;top:-60px; left:880px;"></span>
  44.         <span id="bf" onclick="rbf();"></span>
  45.       </div>
  46.      <div class="items">
  47. <div class="lrc">
  48.         <ul id="ullrc">
  49.          </ul>
  50.       </div>
  51. </div>
  52. </div>
  53. </div></div><br>
  54. <div style="height:740px"></div>
  55. <div style="position:absolute;z-index:32768;background:none;width:100%;left:-34px;margin-top:6px;">
  56. <iframe allowfullscreen="true" border="0" frameborder="no" framespacing="0" height="50" scrolling="no" src="//player.bilibili.com/player.html?isOutside=true&amp;aid=493429452&amp;bvid=BV1AN411u7P3&amp;cid=1333680042&amp;p=1" width="1260"></iframe>
  57. </div><div style="height:90px"></div>
复制代码

313

主题

1万

回帖

7万

积分

超级版主

积分
74616
发表于 2024-10-31 16:22:43 | 显示全部楼层 IP:亚太地区
       欣赏老乡的全屏大图自动切换,太漂亮了,欣赏点赞!

314

主题

6442

回帖

3万

积分

版主

积分
36730
 楼主| 发表于 2024-10-31 16:24:23 | 显示全部楼层 IP:辽宁
老谟深虑 发表于 2024-10-31 16:22
欣赏老乡的全屏大图自动切换,太漂亮了,欣赏点赞!

非常感谢老乡的关注支持,下午好!

140

主题

1万

回帖

4万

积分

超级版主

积分
44233
发表于 2024-10-31 16:26:51 | 显示全部楼层 IP:
欣赏闲云老师大图自动切换,太美了!您真棒!玩得轻松自如,向您学习!

314

主题

6442

回帖

3万

积分

版主

积分
36730
 楼主| 发表于 2024-10-31 16:28:02 | 显示全部楼层 IP:辽宁
风清 发表于 2024-10-31 16:26
欣赏闲云老师大图自动切换,太美了!您真棒!玩得轻松自如,向您学习!

非常感谢风清老师的关注支持,下午好!

313

主题

1万

回帖

7万

积分

超级版主

积分
74616
发表于 2024-10-31 16:36:52 | 显示全部楼层 IP:亚太地区
闲云 发表于 2024-10-31 16:24
非常感谢老乡的关注支持,下午好!

       你把音乐隐藏了不是更好吗。

124

主题

4550

回帖

2万

积分

版主

积分
28603
发表于 2024-10-31 16:42:28 | 显示全部楼层 IP:上海
欣赏你的【音畫素材】全屏大圖自動切換 , 音乐好听!新画面,新视觉,漂亮!

314

主题

6442

回帖

3万

积分

版主

积分
36730
 楼主| 发表于 2024-10-31 16:50:17 | 显示全部楼层 IP:辽宁
老谟深虑 发表于 2024-10-31 16:36
你把音乐隐藏了不是更好吗。

咱们统一使用傲游浏览器,可以直接听到音乐,有使用其他浏览器的,你隐藏了,又不能自动播放,就无法听到音乐了,这样他可以手动点击播放。

314

主题

6442

回帖

3万

积分

版主

积分
36730
 楼主| 发表于 2024-10-31 16:51:04 | 显示全部楼层 IP:辽宁
吴林海 发表于 2024-10-31 16:42
欣赏你的【音畫素材】全屏大圖自動切換 , 音乐好听!新画面,新视觉,漂亮! ...

非常感谢吴老师的关注支持,下午好!
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

手机版|小黑屋|离退休论坛 ( 浙B2-20100176 )

GMT+8, 2024-11-22 00:48 , Processed in 0.103368 second(s), 21 queries .

Powered by Discuz! X3.5

© 2001-2024 Discuz! Team.

快速回复 返回顶部 返回列表