Skip to content

Instantly share code, notes, and snippets.

@danielt69
Created August 17, 2016 09:30
Show Gist options
  • Select an option

  • Save danielt69/2dc9b6e83117571e0a4df34978a1cd9e to your computer and use it in GitHub Desktop.

Select an option

Save danielt69/2dc9b6e83117571e0a4df34978a1cd9e to your computer and use it in GitHub Desktop.
element query css (+js)
<script>
$( window ).load(function() {
function mediaSize() {
var w = $(this).outerWidth();
if (w >= 1200) {
return 'lg';
} else if (w >= 992 && w < 1200) {
return 'md';
} else if (w >= 768 && w < 992) {
return 'sm';
} else if (w < 768) {
return 'xs';
}
}
$(window).on("resize.responsive_widgets", function() {
console.log('resize');
$('section').each(function() {
$(this).attr('data-responsive', mediaSize());
})
}).trigger("resize.responsive_widgets");
});
</script>
<style>
section[data-responsive="lg"] {
}
section[data-responsive="md"] {
}
section[data-responsive="sm"] {
}
section[data-responsive="xs"] {
}
</style>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment