10 JavaScript Code Snippets For Web Developers: From:http://www.bestdesigntuts.com/10-time-saving-javascript-code-snippets-for-web-developers

ActiveMenus.js

//One can make use of the following script to generate menus in an animated fashion. There are several ways of creating a menu such as list, drop down and many more.

function makeMenu(items, tags) {
    // default tags
    tags = tags || ['ul','li']; 
    var parent = tags[0];
    var child = tags[1];
    var item, value = '';
    for (var i = 0,l = items.length; i < l; i++) {
        item = items[i];
        // Separate item and value if value is present
        if (/:/.test(item)) {
            item = items[i].split(': ')[0];
            value = items[i].split(': ')[1];
        }
        // Wrap the item in tag
        items[i] = '<' + child + '' + (value && 'value = "' + value + '"') + ' > ' + item +  '< /'+ child +'>';// add value if present
}
return '<'+ parent +'>'+ items.join('') +'</' + parent + ' >' ;
    }

AnimatedEffects.js

//Looking for providing interesting animated effects to your text? Use the following code snippet for this purpose:

$.fn.animateText = function(delay, klass) {
    var text = this.text();
    var letters = text.split('');
    return this.each(function() {
        var $this = $(this);
        $this.html(text.replace(/./g, '$ & '));
        $this.find('span.letter').each(function(i, el) {
            setTimeout(function() {
                $(el).addClass(klass);
            },
            delay * i);
        });
    });
};

CountingClicks.js

//It may be required to count the number of times an element was clicked. The following code helps you to do that without complicating the code:

// begin counter at zero
$(element).data('counter', 0) 
.click(function() {
    var counter = $(this).data('counter'); // get
    $(this).data('counter', counter + 1); // set
    // do something else…
});

DataValidation.js

//The following code helps in easy formatting of date without having to download heavy JS libraries.

function isValidDate(value, userFormat) {
    // Set default format if format is not provided
    userFormat = userFormat || 'mm / dd / yyyy';
    // Find custom delimiter by excluding
    // month, day and year characters
    var delimiter = /[^mdy]/.exec(userFormat)[0];
    // Create an array with month, day and year
    // so we know the format order by index
    var theFormat = userFormat.split(delimiter);
    // Create array from user date
    var theDate = value.split(delimiter);
    function isDate(date, format) {
        var m, d, y, i = 0,
        len = format.length,
        f;
        for (i; i < len; i++) {
            f = format[i];
            if (/m/.test(f)) m = date[i];
            if (/d/.test(f)) d = date[i];
            if (/y/.test(f)) y = date[i];
        }
        return (m > 0 && m < 13 && y && y.length === 4 && d > 0 &&
        // Check if it’s a valid day of the month
        d <= (new Date(y, m, 0)).getDate());
    }
    return isDate(theDate, theFormat);
}

EmbedYouTube.js

//Here is a code to embed YouTube videos along with custom parameters:

function embedYoutube(link, ops) {
    var o = $.extend({
        width: 480,
        height: 320,
        params: ''
    },ops);
    var id = /\?v\=(\w+)/.exec(link)[1];
    return '< iframe style = "display: block;"'+'type = "text / html"'+'width ="'+ o.width + '"height ="'+ o.height +'"src = "http: //www.youtube.com/embed/' + id + '?' + o.params +
    '&amp;wmode = transparent"frameborder ="0″/>';
}

EmphasizeText.js

//A number of JavaScript libraries are available for highlighting text. However, there is an extremely simple way to do that:

function highlight(text,words,tag){
    // Default tag if no tag is provided
    tag = tag || 'span';
    var i, len = words.length,re;
    for (i=0; i<len; i++) {
        //Global regex to highlight all matches
        re = new RegExp(words[i], 'g');
        if (re.test(text)) {
            text = text.replace(re, ' < ' + tag + 'class = ”highlight” > $ & ');
        }
    }
    return text;
}

FadingElements.js

//A group of components can be made to fade using this code snippet:

$.fn.fadeAll = function (ops) {
  var
  o = $.extend({
    delay: 500,
    speed: 500,
    ease: 'swing' // Other requires easing plugin
  }, ops),
  $el = this
  for (var i=0, d=0, l=$el.length; i<l; i++, d+=o.delay)
    $el.eq(i).delay(d).fadeIn(o.speed, o.ease);
  return $el
}

MaximumHeightWidth.js

//The following code snippet is particularly helpful in building columns of equal height and width:

var getMaxHeight = function ($elms) {
  var maxHeight = 0;
  $elms.each(function () {
    // In some cases you may want to use outerHeight() instead
    var height = $(this).height();
    if (height > maxHeight) {
      maxHeight = height;
    }
  });
  return maxHeight;
};

ReductionOfText.js

//Any text excerpt can be shortened to a specific length with the usage of this code:

function excerpt(str, nwords) {
    var words = str.split('');
    words.splice(nwords, words.length - 1);
    return words.join('') + (words.length !== str.split('').length ?  '& hellip;': '');
}

SetBreakpoints.js

// Breakpoints can be positioned in the code with ease using the following code snippet:
function isBreakPoint(bp) {
    // The breakpoints that you set in your css
    var bps = [320, 480, 768, 1024];
    var w = $(window).width();
    var min, max;
    for (var i = 0,
    l = bps.length; i < l; i++) {
        if (bps[i] === bp) {
            min = bps[i - 1] || 0;
            max = bps[i];
            break;
        }
    }
    return w > min && w <= max;
}