Skip to content

Instantly share code, notes, and snippets.

@YellowSharkMT

YellowSharkMT/BS Classname Helper

Created November 8, 2014 01:10
Show Gist options
  • Save YellowSharkMT/8a651a149c23e62c274d to your computer and use it in GitHub Desktop.
Save YellowSharkMT/8a651a149c23e62c274d to your computer and use it in GitHub Desktop.
Download ZIP
Javascript function that adds a class to the <body> element that denotes a particular responsive view/width for Bootstrap. Class names are bs-lg, bs-md, bs-sm, and bs-xs.
Raw
BS Classname Helper
(function($, _window, undefined) {
$(document).ready(function () {
var $body = $('body');
var $tmp = $('<span id="bs-visibility-tester"/>');
var identifyBootstrapViewname = function (){
$tmp.appendTo($body);
var visible_for;
$.each(['lg','md','sm','xs'], function(z, viewname){
$tmp.addClass('visible-' + viewname);
if($tmp.is(':visible')){ visible_for = viewname; }
$tmp.removeClass('visible-' + viewname)
});
$body.removeClass('bs-xs bs-md bs-sm bs-lg').addClass('bs-' + visible_for);
$tmp.detach().attr('class','');
};
identifyBootstrapViewname();
$(window).resize(identifyBootstrapViewname);
});
})(jQuery, window);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment