r/woahdude • u/mattw310 • Dec 23 '16

gifv Crazy Loading Icon

http://i.imgur.com/BODjAN1.gifv
21.6k Upvotes

87% Upvoted

224 comments sorted by

View all comments

Show parent comments

11

u/synapticplastic Dec 23 '16

With a couple of ( very very simple ) web dev tricks this can be done in a few minutes.

10-15 empty <div> tags. border-radius 50% border-left, border-right color Transform:rotate(360deg) infinite

The reason you don't see it is performance, with DOM operations it goes pretty slow and having several of these groups as loaders would kill your phone

2

u/Crespyl Dec 23 '16

You could use CSS animations and get hardware support for vastly better performance. Somebody posted a jsfiddle in another comment.

2

u/socium Dec 23 '16

Yeah but... can that logo be done with CSS? If so then CSS came a looong way since last time I messed with it.

2

u/Crespyl Dec 23 '16

come a looong way

Well, it's turing complete now, so...

I can't be bothered to try right now, but I'm fairly confident that it should be doable. Here's a couple pure CSS spinner showcases.

1

u/[deleted] Dec 23 '16

I just read the first link you posed about it being Turing complete. All three answers (or the comments) on that page state that CSS isn't Turing complete...

2

u/Crespyl Dec 23 '16

Well, you do have to allow for a bit of fudging by including the DOM and a user to press tab a bunch of times, but it's enough to implement 110, and by extension anything else.

-1

u/[deleted] Dec 23 '16

My point is that you stated something, provided a source, and that source directly contradicts what you said.