bs-breakpoint-detect

A vanilla javascript class to detects the current bootstrap breakpoint which

• adds value to window.currentBreakpoint variable,
• adds data-bs-breakpoint attribute and .bs-{BREAKPOINT-SIZE} class to document body.

Breakpoints are compatible to Bootstrap Version >= 5.2.x.
Values from to Bootstrap's docs:

| Breakpoint | Class infix | Dimensions | |---|---|---| |Extra small| None (xs) | < 576px | |Small| sm | ≥ 576px | |Medium| md | ≥ 768px | |Large| lg | ≥ 992px | |Extra large| xl | ≥ 1200px | |Extra extra large| xxl | ≥ 1400px |

Installation

npm install bs-breakpoint-detect

Setup

Import dependency In your javascript file:

import BsBreakpointDetect from 'bs-breakpoint-detect';

Create new Instance and fire init:

// create new instance
const myDetect = new BsBreakpointDetect(); 

// call init()
myDetect.init();

That's it! 🙂