On the screen: four text boxes cycling through rainbow color backgrounds and spinning wildly in circles.

Manager walks in.

Here's the context.

We were pair programming and working on a simple form. We were just finishing up the style, and I suggested we use a CSS3 animation to make the invalid fields pulsate a light red once.

I'm the young guy in the office, so I am most familiar with the "new" front end stuff like flex and CSS3.

My colleague was unfamiliar with CSS3 animations, so I implemented the red flash quickly and showed him.

He was curious what else you could do with CSS3 animations, so I changed my "to/ from" to a "0%/ 25%/ 75%/ 100%" style animation to show how keyframes worked. Then I made the animation iterations infinite so it went on forever. Of course, I didn't have any normal colors on hand so I just went with my debug colors: red, green, blue, yellow, etc.

We submitted the form with invalid inputs and sure enough, they flashed rainbow colors. It looked pretty funny so I thought "haha, lets quickly add rotation while we're at it"

That's the point where the education turned to a little fun but it wasn't going to take more than a second.

So we did it and it looked pretty funny and it actually made me laugh. Then we started discussing next steps on the form (back-end). Discussion lasted maybe five minutes before our manager visited to update us.

As we were discussing, the invalid controls were still spinning and rainbow colored in the background. Whoops.

The words we managed to say were just "It's invalid" and then we broke out laughing.

So apparently Firefox can't handle (quick) animations from opacity 0 to opacity greater-than-zero and glitches around. Instead you need to animate starting from something greater than 0, like 0.001.

I had to debug this shit and it just adds to my reasons to dislike this browser.

When I was starting programming (learning Actionscript 3) loong time ago I for some reason didnt stubbornly write code into .as files... Instead I just attached code to timeline keyframes in Flash...

headaches..

Likely a very simple algorithm to get these packets processed in the right order, got plenty of metadata that should help, but since yesterday I am wrapping my head around it and cannot figure out a sane way...