A small piece of code to debug bootstrap responsive layouts.
This is only a stupid piece of code to debug responsive layouts based on bootstrap framework. The script add a simple overlay box with basic info that update on resize and scroll events:
- version: bootstrap version 2.x or 3.x
- breakpoint: bootstrap breakpoints @screen-lg, @screen-md, @screen-sm, @screen-xs
- width: window.width()
- height: window.height()
- offsetTop: window.offsetTop()
Extra feature: Show grid overlay
GitHub Page: http://empiricompany.github.io/bootstrap-debugger
Example run on jsbin: http://jsbin.com/kipeya/3/
Credits to detect breakpoints: http://stackoverflow.com/questions/14441456/how-to-detect-which-device-view-youre-on-using-twitter-bootstrap-api