SWUP更改CSS文件以及动画中的淡入效果HeadPlugin

如何解决SWUP更改CSS文件以及动画中的淡入效果HeadPlugin

您好，我遇到了Headplugin如何影响动画的问题，并确定了解决方法，并认为如果有人遇到相同问题，我可以将其发布在此处。同样，所有这些信息可能会被误导，我可能会丢失一些东西，所以请告诉我。

场景：

让我们说我们想对我们网站上的不同页面使用不同的样式表，那么我们可以使用Headplugin这样做。

问题：

更改样式表时，淡出动画将起作用，但淡入动画将不起作用。 （请注意：如果样式表中的元素在两个页面中具有相同的名称，则在淡入淡出动画之间进行转换有时会起作用，具体取决于元素和动画。）

解决方案：

要创建一个单独的样式表，以定义所有页面之间的所有动画，并将其包括在每个html页面中。然后，为每个页面的其余样式或您认为合适的地方准备一个单独的样式表。这样，您仍然可以设置页面之间共享相同ID /类的其余元素的样式。 （缺点：包含所有动画的样式表的初始加载时间，但是该文件应延迟加载：D）

另一个解决方案（我不喜欢）：

拥有一个大的样式表，其中包含每个页面中所有元素的样式（当然不包括嵌入式CSS）。 （缺点1：包含所有动画和其他样式的样式表的初始加载时间，除非您将动画CSS和非动画CSS分成单独的文件，否则不应延迟加载此文件。在这种情况下，只需将样式的初始加载时间文件，除非所有关键样式都已内联完成，在这种情况下，您可以延迟加载两个文件XD。） （缺点2：除非使用内联CSS定义差异，否则元素不能在不同页面上共享相同的ID /类。）

可能的解决方案？ （尚未尝试）：

使用内联CSS定义动画O_O，如果可能的话，请定义idk，但这可能不是一个好主意。

如果有人需要，我可以张贴一些示例来演示问题等。

如果有更安全的方法，请告诉我，否则希望这对OwO有帮助。