background preloader

JQuery & JS

Facebook Twitter

Back_to_top.php. Flexslider. Key Principles of Maintainable JavaScript. JavaScript is a curious language.

Key Principles of Maintainable JavaScript

It's easy to write, but difficult to master. By the end of this article, hopefully, you'll transform your spaghetti code into a five-course meal, full of readable, maintainable yumminess! Why is it So Tough? The thing to remember, above all else when writing JS code, is that it's a dynamic language. This means there are a lot of ways to do things. The "hardness" of JavaScript is clearly evident when considering the following image: The teeny tiny book on the left is Douglas Crockford's MUST READ book, JavaScript: The Good Parts. While both of these books are excellent reads, The Good Parts illustrates that, although JavaScript has a LOT of stuff in it, the good parts can be summed up in a considerably shorter read.

This, naturally, led to a lot of sleepless nights for web developers. You can read an article on the history of JavaScript here, but the gist of it is that Brandon Eich, in 1995, was hired by Netscape to design a language. Making it Better. JQuery Cycle Plugin - Option Reference. The cycle function can be passed a command string in the form: $('#slideshow').cycle('command'); The following command strings are supported: 'pause' // pauses the slideshow, slideshow can be resumed with 'resume' command 'resume' // resumes a paused slideshow 'toggle' // toggles the pause/resume state of the slideshow 'next' // advances slideshow to next slide 'prev' // advances slideshow to previous slide 'stop' // stops the slideshow 'destroy' // stops the slideshow and unbinds all events The following default options are provided by the plugin.

JQuery Cycle Plugin - Option Reference

They can be overridden by passing an options object to the cycle method, by using metadata on the container element, or by redefining these values in your own code. Simple Vertical Align Plugin for jQuery. Sometimes you may want to vertically align a block item, but the CSS-only vertical aligning methods don’t make you feel clean.

Simple Vertical Align Plugin for jQuery

Personally, I hate having to style items as a table/table cell to get them to vertically align in Internet Explorer. jQuery to the rescue. Using a jQuery vertical align snippet as my base code, I modified it to be a jQuery plugin that will allow you to use the function in the jQuery chain. jQuery Vertical Align Plugin Code Simply copy this code into your website (if you don’t know where, leave a comment): (function ($) { // VERTICALLY ALIGN FUNCTION $.fn.vAlign = function() { return this.each(function(i){ var ah = $(this).height(); var ph = $(this).parent().height(); var mh = Math.ceil((ph-ah) / 2); $(this).css('margin-top', mh); }); }; })(jQuery); Now, you can use vAlign as you wish; ie: $('#example p').vAlign();.

Did this make your life easier? If it’s not working Any questions or comments?