Since CSS animations are now so well supported using an animated .gif for a loading spinner is now no longer necessary. The mighty Developer Jon Pearse, showed me how to make a CSS loading spinner so I thought I’d share his technique using a flexible SCSS mixin step by step. This spinner will work in all modern browsers as well as in IE10+. I am presuming here you have used CSS animations before for this tutorial.
Creating the CSS spinner markup
Our spinner is going to be a simple circle spinning around it’s own centre. The spinner markup is just a single div. Our spinner is going to be a pseudo element, ::before (you could use ::after as well) of our div.…
Curated by (Lifekludger)
Read full article at Source: How to create a simple CSS loading spinner & make it accessible
life tools 