Visualisering / Visualisering-frontend

0 stars 1 forks source link

Matrix: fix blinking low dash bug. ESTIMATE: 2h #72

Open sk222sw opened 8 years ago

sk222sw commented 8 years ago

After doing some refactoring the timer for the blinking low dash no longer changes, and it's blinking way too fast atm.

fyrkant commented 8 years ago

Hmm, you just want a _ to blink, right? That could probably be done pretty easily with CSS, like a keyframe animation going from opacity 1 to 0.

fyrkant commented 8 years ago

This looks pretty relevant: http://blog.carbonfive.com/2015/01/07/vintage-terminal-effect-in-css3/

Edit: VIP link directly to the jsfiddle linked from the blogpost: http://jsfiddle.net/rudyjahchan/u5c4k1xg/?utm_source=website&utm_medium=embed&utm_campaign=u5c4k1xg

sk222sw commented 8 years ago

The way I did it was a lowdash that didn't blink while typing, and then blinking when not typing, and I used the same setInterval but with a different millisecond setting. However now I feel really stupid for forgetting that this could be done much easier with CSS...

Thanks! :+1:

fyrkant commented 8 years ago

CSS animations are pretty powerful nowadays, but just really, REALLY confusing and hard to wrap your head around so I totally understand the instinct to reach for JavaScript instead!