Kode for All – by Don Burks
Archive for August, 2011
Fixing Common jQuery Animation Mistakes
0I’ve seen people making the same mistake again and again when I’ve been helping on the jQuery IRC channel, and so I wanted to take the opportunity to write about it a bit to hopefully help clarify what the right way to handle the situation is. Basically, the trap people get themselves into is they want to fade in or out an element on the page, and then apply a CSS class to it. There is a right and a wrong way to do this.
jQuery Notification Plugin
1jQuery BART is a notification plugin for jQuery, or more appropriately an ‘annoyification’ plugin. Bart, of course, is a popular character from a long-running TV show who is well-known for things like spiky hair, yellow skin, and of course, being good at attracting attention to himself. As the purpose of this plugin is to present content on the page that will attract the user’s attention, it seemed to be a fitting name. If you feel that it’s an appropriate name, then all the better. However, if you feel, as some might, that I am trading heavily on the brand of the above-mentioned show(which I haven’t mentioned by name), then you can be very assured that BART is an acronym meaning: Broadcasting And Reporting Things
Full downloads available here on GitHub Minified JS is only 2.1K! Minified CSS also included
Demo available here.
How jQuery.Bart Was Built
4Putting aside the fact that this took far longer to fully code than I wanted it to, I have to say that the process of building jQuery.Bart was fun. I finally got my GitHub repository up and running, and am getting used to committing code into that. I also got to play with some CSS3 animations, and some interesting quirks to the jQuery.animate() function, so overall this was an awesome learning experience.
As I have done with earlier plugins which I have written, I will take you on a brief journey through what went into the construction of this plugin and why I have made some of the choices I have made as far as structure, syntax, and functionality.
