Skip to content

Instantly share code, notes, and snippets.

@IrcDirk

IrcDirk/mediaQuery.js

Forked from roylory/mediaQuery.js
Created January 25, 2019 12:03
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save IrcDirk/f84d45d560dffbb827006fd86e2f81f7 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save IrcDirk/f84d45d560dffbb827006fd86e2f81f7 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. @roylory roylory revised this gist May 13, 2015. 1 changed file with 4 additions and 4 deletions.
    8 changes: 4 additions & 4 deletions mediaQuery.js
    View file
    Original file line number Diff line number Diff line change
    @@ -13,16 +13,16 @@ mediaQuery = (function() {
    return {

    /**
    * is() returns true
    * match() returns true
    * if there's any match to the media query
    *
    * @param {String} str
    * @return {Boolean}
    *
    * ex1: mediaQuery.is('xs')
    * ex2: mediaQuery.is('md lg')
    * ex1: mediaQuery.match('xs')
    * ex2: mediaQuery.match('md lg')
    */
    is: function(str) {
    match: function(str) {
    var arr = str.split(/[\s,|]+/);

    // If there's any match, return true.
  2. @roylory roylory renamed this gist May 13, 2015. 1 changed file with 0 additions and 0 deletions.
    0 gistfile1.js → mediaQuery.js
    View file
    File renamed without changes.
  3. @roylory roylory created this gist May 13, 2015.
    52 changes: 52 additions & 0 deletions gistfile1.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,52 @@
    mediaQuery = (function() {

    // Same as in bootstrap/_variables.less
    // var screenXs = 480; // Not used
    var screenSm = 768;
    var screenMd = 992;
    var screenLg = 1200;

    var screenXsMax = screenSm - 1;
    var screenSmMax = screenMd - 1;
    var screenMdMax = screenLg - 1;

    return {

    /**
    * is() returns true
    * if there's any match to the media query
    *
    * @param {String} str
    * @return {Boolean}
    *
    * ex1: mediaQuery.is('xs')
    * ex2: mediaQuery.is('md lg')
    */
    is: function(str) {
    var arr = str.split(/[\s,|]+/);

    // If there's any match, return true.
    for (var i = 0; i < arr.length; i++) {
    switch (arr[i]) {
    case 'xs':
    if (window.matchMedia('(max-width: ' + screenXsMax + 'px)').matches)
    return true;
    break;
    case 'sm':
    if (window.matchMedia('(min-width: ' + screenSm + 'px) and (max-width: ' + screenSmMax + 'px)').matches)
    return true;
    break;
    case 'md':
    if (window.matchMedia('(min-width: ' + screenMd + 'px) and (max-width: ' + screenMdMax + 'px)').matches)
    return true;
    break;
    case 'lg':
    if (window.matchMedia('(min-width: ' + screenLg + 'px)').matches)
    return true;
    break;
    }
    }
    return false;
    }
    }
    })();