为东西设置动画/添加效果？查询答案

【问题标题】：animate/add effects to stuff? JQUERY为东西设置动画/添加效果？查询
【发布时间】：2017-05-30 13:33:46
【问题描述】：

谁能教我如何添加效果，比如我希望一些文本在单击按钮时褪色，或者制作一个警告框来做一些很酷的事情。我似乎找不到任何关于如何真正实现它的教程......希望得到一些帮助！

【问题讨论】：

查看他们的documentation。
看看 jQuery 的.animate()。如果你想使用 vanilla JS，请使用window.requestAnimationFrame。
meta.stackoverflow.com/questions/284236/…

【解决方案1】：

假设您至少有一些 CSS 和 JS 方面的经验，一个好的简单的解决方案是在 JS 事件上添加/删除 CSS 类并对此做出反应。

这在 JS 中可能如下所示：

jQuery( '.triggering_element' ).click( function( {

    jQuery( '.receiving_element' ).addClass( 'effect' );

} );

在 CSS 中就像这样：

.receiving_element {
    opacity: 0.0;
    visibility: hidden;
    transition: all ease-in-out 1s;
}

.receiving_element.effect {
    opacity: 1.0;
    visibility: visible;
}

你可以用它做各种效果。还有相当复杂的。

在 JS 中你也可以使用不同的事件。请查看 jQuerys on() 了解此内容。

有时最好将类添加到正文而不是接收元素，例如<body class="overlay_open"> ...

我想你明白了。如果没有，您必须先学习一些 CSS 和 JS，然后再处理效果等问题；)

【讨论】：

哦，所以您应该在 css 文件中执行此操作！我虽然 Jquery 有一些“内置效果”谢谢！
可能是。但我很确定 CSS 动画在硬件方面比 jQuery 动画性能要好得多。在我看来，处理方式也更加优雅。无论如何......如果你想做真正花哨的东西，你不会用任何内置效果走远;）
这不是教程平台；）它针对特定问题和特定解决方案。如果您使用一些代码创建一个问题并解释您想要做什么或问题是什么，我很确定您会得到一个有用的答案:)