# Animations in general and Animations for User Cards
**URL:** https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843
**Category:** Feature
**Created:** [March 1, 2015, 3:54am UTC](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843 "2015-03-01T03:54:58Z")
**Posts on this page:** 20
**Page:** 1
### Author:  [@LuaTenshi](https://meta.discourse.org/u/LuaTenshi)
#### Post date: [March 1, 2015, 3:54am UTC](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843/1 "2015-03-01T03:54:58Z")
I have noticed that user cards just pop in without any sort of smooth animation. I was wondering if there is anything planned when it comes to making the user-cards a little fancier?
* * *
There seem to be no animation options on Discourse at all how ever the forum does have animations here and there. I was wondering if there will be a way to configure and or change these animations in the future?
---
### Author:  [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [March 1, 2015, 4:00am UTC](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843/2 "2015-03-01T04:00:45Z")
Sure that is a good idea, subtle animations for usercard in and out would be accepted as PRs!
We do that for lightboxed images. @zogstrip added it.
---
### Author:  [@zogstrip](https://meta.discourse.org/u/zogstrip)
#### Post date: [March 2, 2015, 5:13pm UTC](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843/3 "2015-03-02T17:13:22Z")
Just added a subtle fade-in + scale up animation for the user cards, what do you guys think?
[https://github.com/discourse/discourse/commit/64d0d12632b5833cd0fe1c5ec2945b10b0b9699d](https://github.com/discourse/discourse/commit/64d0d12632b5833cd0fe1c5ec2945b10b0b9699d)
---
### Author:  [@cpradio](https://meta.discourse.org/u/cpradio)
#### Post date: [March 2, 2015, 7:04pm UTC](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843/4 "2015-03-02T19:04:33Z")
Maybe something is wrong with my setup, but I still don’t see any animation taking effect. I’ve reloaded multiple times using Windows 7 Chrome 40.0.2214.115 m
---
### Author:  [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [March 2, 2015, 7:05pm UTC](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843/5 "2015-03-02T19:05:22Z")
It’s a build error, @zogstrip is working on it.
edit: OK, it is there now!
---
### Author:  [@JSey](https://meta.discourse.org/u/JSey)
#### Post date: [March 2, 2015, 8:12pm UTC](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843/6 "2015-03-02T20:12:09Z")
Looks nice in Chrome+Firefox. Safari (8.0.3) doesn’t display any animations here, however…
---
### Author:  [@gerhard](https://meta.discourse.org/u/gerhard)
#### Post date: [March 2, 2015, 8:14pm UTC](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843/7 "2015-03-02T20:14:51Z")
@zogstrip There are no animations when you click on an avatar while another user card is already visible. Is this the intended behavior? Other than that, it looks great.
---
### Author:  [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [March 2, 2015, 8:14pm UTC](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843/8 "2015-03-02T20:14:58Z")
Works in IE as well.
[http://shouldiprefix.com/](http://shouldiprefix.com/) says prefixes should be used, but they are…
---
### Author:  [@zogstrip](https://meta.discourse.org/u/zogstrip)
#### Post date: [March 2, 2015, 8:15pm UTC](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843/9 "2015-03-02T20:15:39Z")
Yet it doesn’t work in Safari ☹
_EDIT:_ the `transition` property requires the `prefix` in the **value** to work in Safari
[https://github.com/discourse/discourse/commit/833d4f524749893b6de369a7af82d55e61c57536](https://github.com/discourse/discourse/commit/833d4f524749893b6de369a7af82d55e61c57536)
---
### Author:  [@JSey](https://meta.discourse.org/u/JSey)
#### Post date: [March 2, 2015, 8:24pm UTC](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843/10 "2015-03-02T20:24:08Z")
> [@codinghorror](#):
>
> but they are…
Not as far as I can see. `#user-card` and `#user-card.show` use `transform: scale` without prefixes. Additionally, `#user-card` has the CSS line
```CSS
transition: opacity .2s, transform .2s;
```
that breaks in Safari…
---
### Author:  [@sam](https://meta.discourse.org/u/sam)
#### Post date: [March 2, 2015, 8:40pm UTC](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843/11 "2015-03-02T20:40:06Z")
I would only scale when showing not when hiding, not 100% convinced we need the scale animation though.
---
### Author:  [@zogstrip](https://meta.discourse.org/u/zogstrip)
#### Post date: [March 2, 2015, 8:45pm UTC](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843/12 "2015-03-02T20:45:40Z")
I agree for the scale animation. It worked great for the thumbnails but doesn’t really make sense for something that’s appearing out of nowhere.
---
### Author:  [@JSey](https://meta.discourse.org/u/JSey)
#### Post date: [March 3, 2015, 6:53pm UTC](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843/13 "2015-03-03T18:53:39Z")
Dunno - I kinda like it. The two animations give somewhat a “cathode ray tube” style which might be lost on the younger generation, but it still looks cool. 😄
And, best of all: now it works in Safari, too.
---
### Author:  [@zogstrip](https://meta.discourse.org/u/zogstrip)
#### Post date: [March 3, 2015, 7:13pm UTC](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843/14 "2015-03-03T19:13:47Z")
Yeah I reduced the scaling effect and will leave it for a while in order to see how it feels 😉
---
### Author:  [@fantasticfears](https://meta.discourse.org/u/fantasticfears)
#### Post date: [March 5, 2015, 6:28pm UTC](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843/15 "2015-03-05T18:28:00Z")
> [@codinghorror](#):
>
> Works in IE as well.
>
> [http://shouldiprefix.com/](http://shouldiprefix.com/) says prefixes should be used, but they are…
gem `autoprefixer-rails` may be a good option to add prefixes.
@zogstrip What do you think of transition for change user card by clicking others user card when the user card is being shown.
---
### Author:  [@LuaTenshi](https://meta.discourse.org/u/LuaTenshi)
#### Post date: [March 5, 2015, 8:01pm UTC](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843/16 "2015-03-05T20:01:59Z")
Looks and feels great so far, noticed that it magically fixed the problem with Usercards sometimes getting stuck. So I no longer have to use…
```
$("#user-card").removeClass("hidden").addClass("hidden");
```
[http://img.twisted.cat/tenshi/2015/03/05\_14-56-15.gif](http://img.twisted.cat/tenshi/2015/03/05_14-56-15.gif)
Can’t wait for some settings to be added so that devs can easily change the current transition or make their own transitions.
---
### Author:  [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [March 5, 2015, 9:26pm UTC](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843/17 "2015-03-05T21:26:26Z")
Well you can override this immediately in the CSS If you like, right now, via Admin, Customize, CSS.
---
### Author:  [@LuaTenshi](https://meta.discourse.org/u/LuaTenshi)
#### Post date: [March 5, 2015, 11:56pm UTC](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843/18 "2015-03-05T23:56:35Z")
Yes forgot to mention that its possible to do that, and I am already doing it as you can see in my gif. (Circle avatars.)
I was just saying that it would be nice to have a dialogue with a few pre-sets for people who are lazy like me, or for people who don’t know CSS well enough to do animations.
---
### Author:  [@zogstrip](https://meta.discourse.org/u/zogstrip)
#### Post date: [March 6, 2015, 10:39am UTC](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843/19 "2015-03-06T10:39:13Z")
> [@fantasticfears](#):
>
> @zogstrip What do you think of transition for change user card by clicking others user card when the user card is being shown.
Sure, have a try at it. But make sure it’s very subtle and that your PR has a GIF showing the animation 😉
---
### Author:  [@fantasticfears](https://meta.discourse.org/u/fantasticfears)
#### Post date: [March 19, 2015, 7:00pm UTC](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843/20 "2015-03-19T19:00:18Z")
One line of code…
[https://github.com/discourse/discourse/pull/3285](https://github.com/discourse/discourse/pull/3285)
[Next page](https://meta.discourse.org/t/animations-in-general-and-animations-for-user-cards/25843.md?page=2)