js-responsive-container v1.0.2

Simple responsive container with javascript

Install

// install with npm
npm install js-responsive-container

Usage

<div class="container">
  <p>Some content</p>
</div>

import ResponsiveContainer from 'js-responsive-container';

const container = new ResponsiveContainer();

container.add();

Options

new ResponsiveContainer(options)

const options = {
  selector: '.container', // any valid css selector, default: '.container'
  padding: 10, // integer, default: 10
  breakpoints: [
    // array of objects, default: bootstrap 5 breakpoints
    {
      max: 575,
    },
    {
      min: 576, // integer. If not specified, min = 0
      max: 767, // integer. If not specified, max = Infinity
      width: 540, // integer. If not specified, width = 100%
    },
    {
      min: 768,
      max: 991,
      width: 720,
    },
    {
      min: 992,
      max: 1199,
      width: 960,
    },
    {
      min: 1200,
      max: 1399,
      width: 1140,
    },
    {
      min: 1400,
      width: 1320,
    },
  ],
};