这并不是确切回答您的问题,但过渡效果在CSS中非常简单。(我不常用动画,所以无法提出意见。)
这是我从最近的项目中剪贴的一片CSS,它在用户将鼠标悬停在元素上时执行过渡,一个 disclosure chevron,在大纲控件中。它使元素略微变大和变暗,一个微妙但又明显的改变。
基本元素
.tree-control--chevron-div {
...
font-size: 70%;
color: var(--chevron-color);
opacity: 0.9;
transition: opacity 0.3s, font-size 0.3s, color 0.3s ease-in-out;
...
}
鼠标悬停时的CSS
.tree-control--chevron-div:hover {
font-size: 75%;
opacity: 1;
color: black;
}
元素的基本类指定了过渡应如何发生。伪类的CSS指定了它应过渡什么。
据我所知,在Reagent中这样做的问题是没有方法可以指定伪元素的行为。
如果您不介意添加另一个依赖,garden
是一个用于向Clojure应用添加CSS的库。它的语法与Hiccup非常相似。还有stylefy
用于ClojureScript。两者都有略微扩展的Hiccup-like语法来处理如hover之类的伪元素。
如果您真的需要动画,我帮不了忙。很抱歉浪费了您的时间。