以下是我的代码:

在这里，我试图通过用一个图层覆盖边框，然后以特定的方式移动该图层来实现边框动画，以便边框缓慢而平滑地显示出来。

在这里，红色层的边框覆盖工作正常，因为它慢慢地打开边框，（要查看实际的预期动画，您可能需要将红色更改为白色）

类似，我试图用红色层（标题2部分）动画部分，但在那里，小石灰层没有什么问题，

1. 实际上，它应该在标记框区域中移动，但它当前正在标记框区域中移动。这也显示在下面的图像中。
2. 可能定位不正确，因为最初我觉得它的左上角应该和蓝框的左上角对齐

长话短说，我希望石灰层以类似于红色的方式正确地动画，但它们在不同的方向上。

jsfiddle:https://jsfiddle.net/csgwutjp/1/请通过增加窗口大小来查看，如所附图片所示。

顺晟科技：

当动画右侧边框时，我们需要交换正在移动的“掩码”，这样覆盖整个边框的部分就会向右，而只覆盖下半部分的较短部分就会向左。

在这样做时，我们还必须更改定位和转换以匹配。