Skip to content

Instantly share code, notes, and snippets.

@arielgk

arielgk/app.js

Last active November 18, 2015 20:07
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save arielgk/9ffd0a451c3a0a3cc26a to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save arielgk/9ffd0a451c3a0a3cc26a to your computer and use it in GitHub Desktop.
Download ZIP
mqueries.js
Raw
app.js
$.fn.mqueryjs({
'type': 'screen',
'token': 'only',
'unit': 'px',
'container': 'body',
'zones': {
'small': {
'min': 0,
'max': 320
},
'medium': {
'min': 321,
'max': 600
},
'large': {
'min': 601,
'max': 1024
},
'xlarge': {
'min': 1025,
'max': 1620
},
'xxlarge': {
'min': 1621,
'max': 1920
},
}
});
var jsZone = $.fn.mqueryJsZoneCurrentIndex();
switch (jsZone) {
case 0:
createslides(2, false);
break;
case 1:
createslides(2, false);
enlargeValue = 1;
leftMove = '-10px';
break;
case 2:
createslides(4, true);
enlargeValue = 1.2;
leftMove = '-10px';
break;
case 3:
createslides(5, true);
enlargeValue = 1.4;
leftMove = '-100px';
break;
case 4:
createslides(6, true);
enlargeValue = 1.3;
leftMove = '-100px';
break;
}
Raw
fun.js
function sliderHeight() {
var currSize = sizeOrder(sizeDetector());
if (currSize !== 0) {
$('#hero').removeClass();
$('#hero').addClass('vh_height' + (currSize + 1) * 17);
// $('#hero').addClass('vh_height81');
} else {
$('#hero').removeClass();
$('#hero').addClass('vh_height' + (currSize + 1) * 30);
}
}
Raw
plug.js
/**
* jquery.mqueryjs.js master
*/
(function($) {
$.fn.mqueryjs = function(options) {
var settings = $.extend({
// These are the defaults.
'type': 'screen',
'token': 'only',
'unit': 'px',
'container': 'body',
'zones': {
'small': {
'min': 0,
'max': 320
},
'medium': {
'min': 321,
'max': 600
},
'large': {
'min': 601,
'max': 1024
},
'xlarge': {
'min': 1025,
'max': 1920
},
},
}, options);
var ble = '';
$.each(settings.zones, function(key, value) {
ble += createMq(value.min, value.max, key, settings);
//console.log(ble);
});
$('<style type="text/css">' + ble + '</style>').appendTo($('head'));
createDivs(settings);
};
function createMq(min, max, zone, settings) {
var mq = '';
mq = '@media ' + settings.token + ' ' + settings.type + ' and ';
if (min !== undefined) {
mq += '(min-width:' + min + settings.unit + ')';
}
if (min !== undefined && max !== undefined) {
mq += ' and ';
}
if (max !== undefined) {
mq += '(max-width:' + max + settings.unit + ')';
}
mq += '{';
$.each(settings.zones, function(key, value) {
if (key != zone) {
mq += '.mqueryjs-' + key + '{display:none;}';
} else {
mq += '.mqueryjs-' + key + '{display:block;}';
}
});
mq += '}';
return mq;
}
function createDivs(settings) {
$('.mqueryjs-hidden').remove();
$('body').append('<div class="mqueryjs-hidden"></div>');
$.each(settings.zones, function(key, value) {
var diva = document.createElement("div");
$('.mqueryjs-hidden').append(diva);
var $thisDiv = $('.mqueryjs-hidden').find('div').last('div').addClass('debugsize mqueryjs-' + key);
$thisDiv.html(key);
});
}
$.fn.mqueryJsIsZone = function(size) {
$('.debugsize').each(function() {
if ($(this).css('display').toLowerCase() == 'block') {
var sizee = $(this).attr('class').split('-').pop();
if (size) {
if (size == sizee) {
rn = true;
} else {
rn = false;
}
} else {
rn = sizee;
}
}
});
return rn;
};
$.fn.mqueryJsZoneList = function() {
var sizz = [];
$('.debugsize').each(function() {
sizz.push($(this).attr('class').split('-').pop());
});
return sizz;
}
$.fn.mqueryJsZoneCurrentIndex = function(rnString) {
var sizeIndex;
var sizeString;
$('.debugsize').each(function(index, item) {
if ($(this).css('display').toLowerCase() == 'block') {
sizeIndex = index;
sizeString = $(this).attr('class').split('-').pop();
}
});
if (rnString) {
return sizeString;
} else {
return sizeIndex;
}
}
}(jQuery));
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment