Javascript with detect

gistfile1

        // Manages changes in responsive layout
        var layout = (function() {
            var callbacks = [];
    
            // Container for checking changes in layout width
            var $container = $('#header .container');
            
            // Container width: screen width
            var steps = {
                960: 960,
                714: 768,
                451: 480,
                294: 320
            };
            var width = $container.width();
            
            // On each step call all callbacks
            $(window)
                .on('resize', function() {
                    var current = $container.width();
                    if (current != width) {
                        width = current;
                        $.each(callbacks, function(id, callback) {
                            callback(steps[width]);
                        });
                    }
                })
                .trigger('resize');
            
            // Interface
            return {
    
                // Returns current step
                width: function() {
                    return steps[width];
                },
                
                // Register callback
                change: function(callback) {
                    callback(steps[width]);
                    callbacks.push(callback);
                }
            };
        })();