这是一个专门讨论 idea 的地方。

每个人的时间,资源是有限的,有的时候你或许能够想到很多 idea,但是由于现实的限制,却并不是所有的 idea 都能够成为现实。

那这个时候,不妨可以把那些 idea 分享出来,启发别人。
Archeb

在禁止使用 @keyframe 的情况下,纯 CSS 制作一个背景轮播图?

  •  
  •   Archeb · Mar 27, 2020 · 3324 views
    This topic created in 2417 days ago, the information mentioned may be changed or developed.

    其实事情是这样的,我发现了 Discuz 一个可以自定义个人空间 CSS 的接口。 过滤了引号、分号、 @和 > ,想着怎么能在这些限制的情况下做一个最骚的个人空间

    方案一,transition delay 这是目前我在用的 见 https://www.hostloc.com/space-uid-27573.html,缺点是轮播数量受限...不过只要找多几个元素其实上限可以很高

    方案二,引入 SVG + Animation SVG 作为外链被插入的时候不能再用内部 image 引用外链图片,但可以用 Data URI 绕过。 这个方法不太好,主要是图片大小不好控制,就抛弃了

    不知道大家还有啥奇思妙想可以做到呢 (关于 Discuz 论坛如何自定义 CSS,见 https://www.hostloc.com/thread-663348-1-1.html )

    7 replies  •  2020-03-29 19:41:36 +08:00
    alphardex
    alphardex
    Mar 27, 2020
    1
    之前做过 ken-burns 背景轮播效果 https://codepen.io/alphardex/pen/wvBovww,不用 @keyframes 感觉有点难
    ClarkAbe
    ClarkAbe
    Mar 27, 2020 via iPhone
    2
    GIF
    Archeb
    Archeb
    OP
    Mar 28, 2020
    3
    @ClarkAbe 这个可以有,还可以配合服务端动态生成
    dyxang
    dyxang
    Mar 29, 2020
    4
    个性化 nice
    hzlzh
    hzlzh
    Mar 29, 2020
    5
    @Archeb 服务端动态生成的思路有点意思
    dyxang
    dyxang
    Mar 29, 2020
    6
    额……没成功,粘贴了 css 结果没成功(在别的 discuz 网站试的)
    dyxang
    dyxang
    Mar 29, 2020 via Android
    7
    是必须要个人空间自定义,好吧……
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Privacy   ·   Solana   ·   1545 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 69ms · UTC 00:29 · PVG 08:29 · LAX 16:29 · JFK 19:29
    ♥ Do have faith in what you're doing.