问题标签 [css-doodle]

我正在玩css-doodle，我正在尝试在网格中制作螺旋动画。

我想要做的是让它无限地在螺旋向外和再次螺旋之间交替。infinite目前，即使我将参数添加到animation属性中，我也只能让它播放一次动画。

我正在尝试使用两个动画：

然后像这样无限地播放它们，中间有延迟： animation: bg 12.1s linear calc(.05s*var(--RES)) forwards infinite, bg-reverse 12.1s linear calc(.05s*@max-col()*@max-row() + (.05s*@max-col()*@max-row() - .05s*var(--RES))) forwards infinite;

这是我的代码笔：https ://codepen.io/anon/pen/xzWxrd?editors=1000

有人看到我在这里做错了吗？

编辑：添加片段。反向动画在这里似乎不起作用：S

https://codepen.io/tuckermassad/pen/rPYNLq

我将 CSS 涂鸦代码从那里复制到我的角度组件中：

现在，我用 安装了 css-doodle npm i css-doodle，我运行了这个项目，我得到了以下错误：

有没有办法以角度使用css doodle？

我已经使用 css-doodle 为我的页面设置了背景。全屏时看起来不错，但由于我的网格设置方式，形状随着屏幕变小，在分屏或模拟移动设备时完全不可见。我希望它们在视觉上总是相同的大小。

这是我尝试添加的媒体查询，但它似乎没有做任何事情。（我对RWD相当陌生，所以我不确定问题是什么。）

这是我的CSS-Doodle代码。

当悬停在涂鸦上时，我想制作随机的“闪烁”效果。为此blink，当用户将鼠标悬停在涂鸦容器上时，我将动画名称存储到变量中。由于某种原因，动画仅适用于网格的第一个元素。有没有办法将动画应用于所有元素？

CodePen：https ://codepen.io/entityinarray/pen/mdbRPRz

应用程序状态正常。当我更改 textarea 中的值时，它正在更新，我可以使用 react 实用程序看到状态组件的更改，但 css doodle 不会更新。我必须手动刷新才能看到我不明白为什么的更改。非常感谢

我使用 CSS Doodle 堆叠了这种六边形图案。问题是：我想让六边形更小 1.5-2 倍并且更对称（现在它就像被 X 轴拉伸了一点点），但是必须保存视口更改时的响应。我试图结合许多价值观，但这是我能够做到的最终版本。这里有一个codepen和代码：

https://codepen.io/mepuduah/pen/dyyjRqP

我正在寻找使用 CSS 生成 12 个房屋图表的矩形形状。我能用的最好的是下面的 CSS-doodle 代码；即使它在任何地方都不完美。下面的示例图像如何实现？结构必须是单一结构，我想为所有房屋添加文字。

我有一个 css-doodle 动画，它基本上是一个小的动画圆圈，我想用它来代替我的网站标题（h1）中的字母“O”。因此，动画需要在同一行作为我的标题，每边都有标题文本（例如：“PURPLE XM[css-doodle]SS”）。我还想在标题周围放置一个虚线边框，并确保即使在更改页面宽度时仍能显示 css-doodle 动画。我的 HTML 和 CSS 样式表如下：

在css-doodle网站上，他们的第一个示例使用了这样的“±”符号：

我以前从未在 JS 或 CSS 中使用过这个，所以我只是想知道这是否是 css-doodle 独有的一些功能，或者这实际上可以在 CSS 或 JS 中使用吗？