css - Bootstrap3 Replace input-lg with input-sm on small screens -
i'm using twitter bootstrap's input-lg class on inputs. there (maybe javascript) way replace twitter bootstrap's input-sm on smaller screens, font-size, height, line-height , padding on input "shrink" bootstrap way? or easier media-queries myself?
the javascript (jquery) way (e.g.) (not tested):
$(window).resize(function() { if ($(window).width() < 768) { $("input").addclass("input-sm"); } else if ($(window).width() >= 768 && $(window).width() <= 992) { $("input").removeclass("input-sm"); $("input").removeclass("input-lg"); } else if ($(window).width() > 992 && $(window).width() <= 1200) { $("input").addclass("input-lg"); } else { // greater screen sizes if want } });
i think better solution, because writing own media queries, copy bootstraps css these existing classes... if prefer that, this post start.
Comments
Post a Comment