问题标签 [ng-animate]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
6405 浏览

css - 使用 Angularjs 动画在悬停时更改元素

所以这只是我正在尝试做的一个示例。我想使用 Angularjs 为悬停时元素的不透明度设置动画,但我无法让它做任何事情。我一直在阅读文档,但我似乎无法弄清楚出了什么问题。任何帮助表示赞赏。请参见下面的示例。

http://jsbin.com/AdIXIKU/1/edit

先感谢您

0 投票
1 回答
410 浏览

javascript - Angular 1.2.5 嵌套动画

使用 ng-view,我想要一个简单的 fadeIn/fadeOut 用于页面转换。但是,在不同的“视图”中,我希望在父元素上发生淡入/淡出的同时制作子元素。问题是,如果父母正在制作动画,那么角度取消的任何嵌套动画。为什么是这样?还有其他方法可以实现我想要的吗?

0 投票
1 回答
809 浏览

angularjs - ng-Animate 不会删除添加类 angular 1.2.x

我试图在加载时让图标动画,并在加载完成后停止动画。我试图通过激活一个基于刷新属性的类来实现这一点。这在 AngularJS 1.2.0-rc.3 中有效,但是现在(已经尝试过 1.2.3 和 1.2.4)动画永远不会停止,我相信原因是添加的 -add 类在绑定时没有被删除变量更改为假。

这是plunker演示。

http://plnkr.co/edit/fbcCPxwZtcIoS0ZqrHhf?p=preview

有趣的是,更多的变量切换最终会停止动画。我想做的是否有效,我想我总是可以只显示隐藏加载 gif,但我喜欢为现有图像设置动画的想法

谢谢!生硬

0 投票
2 回答
1168 浏览

javascript - 基于媒体查询的角度js动画不适用于窗口调整大小

请参阅以下 plunker 示例:http ://plnkr.co/edit/e7Pr3O8mAaONiDiXFQay?p=preview

这是我从 ng 文档中获取的简单 Angular.js 动画设置。

我对其进行了调整,使其具有媒体查询(在 css 文件上),因此动画仅在屏幕宽度小于 640 像素的情况下才有效。当屏幕大于 640px 时,div 只会显示/隐藏而没有动画。

它在页面重新加载时效果很好。但是,当我重新调整页面大小以“测试响应能力”时,动画不再发生。

你能解释一下为什么会发生这种情况,它是否可以以某种方式修复?

非常感谢您的帮助!谢谢

0 投票
1 回答
442 浏览

javascript - ng-animate 创建一个 slideIn / slideOut 过渡

我很难使用 angular 执行简单的幻灯片转换,我知道如何使用 jquery 完美地做到这一点,但是我正在尝试使用 angular 及其工具。这里提供了一个到目前为止所做的示例单击此处例如- 单击链接商店..

控制器

});

有谁知道如何使用角度实现幻灯片效果

0 投票
1 回答
2081 浏览

angularjs - 输入未在 Angular 中播放的动画

我想知道当角度应用程序启动时如何为元素设置动画。

事实上,我看到(我可能做错了什么)动画模块第一次没有触发“进入”事件,但在一切正常之后。我如何在不重写我在其他地方的动画模块中的所有代码的情况下对其进行动画处理?

你可以在我的小提琴上看到li 乍一看是绿色的,当我需要它是蓝色时,正如我的进入动画中定义的那样。

我不知道它是否只发生在我的配置中,如下所示:

, 动画 test-anim 类。

感谢您的回答

0 投票
1 回答
221 浏览

angularjs - 定位子元素时 ngClass 动画失败

我不明白为什么这里的动画不起作用: http ://plnkr.co/edit/ulq1MQNDtY9cO2pcjdzF?p=preview

应该发生的是:

  • 0在添加类上:从to增长200px并使背景颜色从redto过渡blue
  • 删除类:从200pxto收缩0并使背景颜色从greento过渡yellow

知道为什么吗?
谢谢你。

0 投票
1 回答
816 浏览

angularjs - ngClass在父级上更改时如何为子元素设置动画

是否可以在子元素上定义转换并在 ngClass 为父元素更改时将其考虑在内?

到目前为止,我还无法做到这一点。
http://plnkr.co/edit/ulq1MQNDtY9cO2pcjdzF?p=preview

谢谢。

0 投票
0 回答
52 浏览

angularjs - 如何判断动画何时在指令内完成播放以在输入上调用 focus()

是否有一种“角度方式”可以知道何时在元素上完成动画?
我想focus()在输入动画后调用它。

目前,我必须在桌面上选择:

  • setTimeout(fn,0);这是hacky
  • 侦听transitionend如果浏览器不支持转换则不会触发的事件

我希望注入$animate指令可能会给我这个信息。

你会怎么做?

0 投票
2 回答
3403 浏览

angularjs - 在 AngularJS ngRepeat 中动画 ng-move 动画错误的项目

在 ng-repeat 中为 ng-move 设置动画时,我有点困惑。例如,如果我将数组项从 3 移动到 7,则项 4-7 会向上移动并且它们会生成动画。但是,我从 3 移动并放置在位置 7 的实际项目没有。这是一个 plunkr 演示我的问题。

http://plnkr.co/edit/4yRkLWbsU57YxrYOrWUQ?p=preview

但是,将项目 7 移动到 3 可以按我的预期工作,为单个移动的项目设置动画,而不是对已下推的项目进行动画处理。

这对于向用户显示移动的内容不是很有用。应该如何正确地为 ng-move 设置动画?