https://github.com/judas-christ/breaks2000

Responsive elements script.
https://github.com/judas-christ/breaks2000

container-queries element-queries javascript web

Last synced: about 1 month ago
JSON representation

Responsive elements script.

• Host: GitHub
• URL: https://github.com/judas-christ/breaks2000
• Owner: judas-christ
• License: mit
• Created: 2014-04-11T06:51:27.000Z (over 10 years ago)
• Default Branch: master
• Last Pushed: 2017-03-08T18:44:30.000Z (almost 8 years ago)
• Last Synced: 2024-11-24T11:04:13.836Z (about 1 month ago)
• Topics: container-queries, element-queries, javascript, web
• Language: JavaScript
• Size: 23.4 KB
• Stars: 6
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Breaks 2000

> A simple responsive elements script. Inspired by https://github.com/kumailht/responsive-elements but simpler and without any dependencies.

## Usage

Add breakpoints to responsive elements

```html

...

```


Add CSS styles for the sizes

```css

.\>320 {

	background-color: peachpuff;

}

.\>768 {

	background-color: aliceblue;

}

```

Add breaks2000 script to page

```html

```

or if you prefer to self-host

```html

```

Call initialization function on page load

```js

breaks2000.init();

```

When adding elements to page call

```js

breaks2000.update();

```

If, for some reason, breaks2000 has to be deactivated on a page call

```js

breaks2000.uninit();

```

## Browser support

Modern browsers and optionally IE8.

## Change Log

### 2.3.0

* UMD bundle

* unpkg CDN example

### 2.2.0

* ES6 module support

* CJS module support

### 2.1.2

* Bower support

### 2.1.1

* Bugfixes

### 2.1.0

* Added optional `uninit()` function for removing breaks2000.

### 2.0.0

* Class names changed from `gt-[size]`/`lt-[size]` to `>[size]`/`<[size]`. *This is a breaking change from 1.0.0*

## License

Released under MIT License.