12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091 |
- /*
- Breakpoints.js
- version 1.0
-
- Creates handy events for your responsive design breakpoints
-
- Copyright 2011 XOXCO, Inc
- http://xoxco.com/
- Documentation for this plugin lives here:
- http://xoxco.com/projects/code/breakpoints
-
- Licensed under the MIT license:
- http://www.opensource.org/licenses/mit-license.php
- */
- (function($) {
- var lastSize = 0;
- var interval = null;
- $.fn.resetBreakpoints = function() {
- $(window).unbind('resize');
- if (interval) {
- clearInterval(interval);
- }
- lastSize = 0;
- };
-
- $.fn.setBreakpoints = function(settings) {
- var options = jQuery.extend({
- distinct: true,
- breakpoints: new Array(320,480,768,1024)
- },settings);
- interval = setInterval(function() {
-
- var w = $(window).width();
- var done = false;
-
- for (var bp in options.breakpoints.sort(function(a,b) { return (b-a) })) {
-
- // fire onEnter when a browser expands into a new breakpoint
- // if in distinct mode, remove all other breakpoints first.
- if (!done && w >= options.breakpoints[bp] && lastSize < options.breakpoints[bp]) {
- if (options.distinct) {
- for (var x in options.breakpoints.sort(function(a,b) { return (b-a) })) {
- if ($('body').hasClass('breakpoint-' + options.breakpoints[x])) {
- $('body').removeClass('breakpoint-' + options.breakpoints[x]);
- $(window).trigger('exitBreakpoint' + options.breakpoints[x]);
- }
- }
- done = true;
- }
- $('body').addClass('breakpoint-' + options.breakpoints[bp]);
- $(window).trigger('enterBreakpoint' + options.breakpoints[bp]);
- }
- // fire onExit when browser contracts out of a larger breakpoint
- if (w < options.breakpoints[bp] && lastSize >= options.breakpoints[bp]) {
- $('body').removeClass('breakpoint-' + options.breakpoints[bp]);
- $(window).trigger('exitBreakpoint' + options.breakpoints[bp]);
- }
-
- // if in distinct mode, fire onEnter when browser contracts into a smaller breakpoint
- if (
- options.distinct && // only one breakpoint at a time
- w >= options.breakpoints[bp] && // and we are in this one
- w < options.breakpoints[bp-1] && // and smaller than the bigger one
- lastSize > w && // and we contracted
- lastSize >0 && // and this is not the first time
- !$('body').hasClass('breakpoint-' + options.breakpoints[bp]) // and we aren't already in this breakpoint
- ) {
- $('body').addClass('breakpoint-' + options.breakpoints[bp]);
- $(window).trigger('enterBreakpoint' + options.breakpoints[bp]);
- }
- }
-
- // set up for next call
- if (lastSize != w) {
- lastSize = w;
- }
- },250);
- };
-
- })(jQuery);
|