How can you tell if a programmer knows Sass in 5 questions?

This article was originally posted on snap.hr

Recently I have been asked my Robert Tucker from snap.hr to write an article about SASS. Basically its a set of 5 questions(with answers) that sort the Sass noobs from the pros.

These 5 fiendish questions will test anyone’s Sass skills. Ready? Let’s go!

1) Why is it bad idea to use a mixin like this:

Continue Reading →


Controlling CSS animations with Javascript

Recently I been working on adding new features to my jQuery marquee plugin. I was trying to add CSS3 animation support to the plugin so it performs better as jQuery animate change the CSS property inside a loop to complete animations.

For example animating something using jQuery animate:

See the Pen wdcIl by Aamir Afridi (@aamirafridi) on CodePen

If you inspect the above green box in developer toolbar and than click it, you can see that jQuery changes the margin-left inside a timer i.e setInterval. To check the code, see this.

Coupled with a touch of JavaScript, CSS animations and transitions are able to accomplish hardware-accelerated animations and interactions more efficiently than most JavaScript libraries.

Many animations in your JS app will affect the performance and will make the animations slower and jerky. So why not use CSS3 animations where browser supports it and use jQuery animate as fallback? or better not to use animations at all where you can avoid so older browsers can perform well.

Continue Reading →


jQuery Marquee Plugin with CSS3 Support

Please check github for details about new updates.

Also the plugin is now hosted on jsDelivr.com(CDN).

Recently I been working on a project where a static text message needs to be animated similar to non-standard HTML marquee tag.

Googling gives me quite few jQuery plugins but they got so many options and complex html layout/structure was needed for the plugin to work. I decided to make a simple jQuery plugin which can scroll the text either left, right, up or down.


Continue Reading →

Copyright © 2018 — musings of Aamir Afridi