bootstrap 过渡和动画辅助工具/实用程序

jtjikinw  于 6个月前  发布在  Bootstrap
关注(0)|答案(4)|浏览(77)

前提条件

建议

为Bootstrap的用户提供一些过渡和动画助手或实用程序将非常有用。
我们需要定义哪种类型的过渡和动画,以及根据使用情况将其作为助手还是实用程序是否最佳。
这个问题可以通过几个子步骤来解决。

让我们从动画方向开始

已经确定了一个用例并将关闭 #38053
对于动画方向,它可以是类似于以下内容(带或不带“direction”一词):

  • .animation-direction-normal
  • .animation-direction-reverse
  • .animation-direction-alternate
  • .animation-direction-alternate-reverse

但它可能只适用于单个动画(参见 https://developer.mozilla.org/en-US/docs/Web/CSS/animation-direction#syntax )。

定义其他类型的助手和实用程序

待办事项

动机和背景

最初是在尝试修复 #38053#38081#38054 的问题时讨论的。
请参阅从第38081条评论开始的线程。

wnvonmuf

wnvonmuf1#

Hi @julien-deramond 做了一篇关于这个的PR。这是你的想法吗?

bnlyeluc

bnlyeluc2#

感谢@oraliahdz的这个PR,但这并不是我们所期望的(我已经关闭了#38160)。我们希望创建通用的动画助手/实用程序,而不是与spinners相关的。

bkhjykvo

bkhjykvo3#

你好,@julien-deramond,感谢你的澄清。我正在测试这些更改。除了spinners之外,我还可以使用哪些其他组件?

fcipmucu

fcipmucu4#

你好@julien-deramond和@oraliahdz。我也尝试以一种稍微不同的方式解决这个问题,并打开了一个PR。这可能是一个很好的第一步想法。我在helpers中创建了一个名为animations.scss的文件来处理与动画相关的类。我很高兴听取您对这个实现的反馈。

相关问题