if-breakpoint.js is a brilliant tiny jQuery plugin to execute conditional capabilities tailor-made to particular display sizes.
It intelligently detects Bootstrap breakpoints and triggers actions accordingly, which lets you improve your UI with performance focused for every viewport measurement.
Use instances:
- Dynamic content material supply primarily based on the display measurement.
- Responsive navigation menus.
- Adaptive layouts.
- Gadget-specific performance.
- As a JavaScript-based different to CSS media queries.
Learn how to use it:
1. Select the suitable JS file primarily based on the Bootstrap model in your challenge.
<!-- jQuery is required --> <script src="/path/to/cdn/jquery.min.js"></script> <!-- Bootstrap 5 --> <script src="/path/to/if-b3-breakpoint.min.js"></script> <!-- Bootstrap 4 --> <script src="/path/to/if-b4-breakpoint.min.js"></script> <!-- Bootstrap 3 --> <script src="/path/to/if-b4-breakpoint.min.js"></script>
2. Execute the suitable operate primarily based on the present viewport measurement.
if ( xs == true ) {
// do one thing
};
if ( sm == true ) {
// do one thing
};
if ( md == true ) {
// do one thing
};
if ( lg == true ) {
// do one thing
};
if ( xl == true ) {
// do one thing
};
if ( xxl == true ) {
// do one thing
// Bootstrap 5 solely
};
This superior jQuery plugin is developed by JacobLett. For extra Superior Usages, please examine the demo web page or go to the official web site.
