https://github.com/ryanve/vibe

CSS classes for the masses
https://github.com/ryanve/vibe

classlist javascript

Last synced: about 1 month ago
JSON representation

CSS classes for the masses

• Host: GitHub
• URL: https://github.com/ryanve/vibe
• Owner: ryanve
• Created: 2012-09-09T23:18:40.000Z (about 12 years ago)
• Default Branch: master
• Last Pushed: 2014-12-16T22:47:11.000Z (almost 10 years ago)
• Last Synced: 2024-05-02T00:09:04.345Z (7 months ago)
• Topics: classlist, javascript
• Language: JavaScript
• Homepage: https://npm.im/vibe
• Size: 352 KB
• Stars: 6
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# vibe

#### cross-browser `[class]` JavaScript [module](https://npmjs.org/package/vibe)—uses [classList](https://developer.mozilla.org/en-US/docs/DOM/element.classList) where available

```sh

$ npm install vibe

```

## API ([0.9](../../releases))

### Parameters

- element denotes a native DOM Element

- token denotes a single class name

- $ denotes a jQuery-compatible lib such as [ender](https://github.com/ender-js/Ender)

- ? denotes a optional parameter

- stack denotes an array or collection of elements

- ssv denotes where multiple classes can be passed via array, space-separated string, or a callback to determine them. Callbacks run for each element as `this` and may return `false` to cease further iterations.

### Fast simple static methods

- `vibe.addClass(element, token)`

- `vibe.removeClass(element, token)`

- `vibe.toggleClass(element, token, force?)`

- `vibe.hasClass(element, token)`

### [jQueryish](http://api.jquery.com/category/manipulation/class-attribute/) chain methods

#### Integrated syntax

- `$(elements).addClass(ssv)`

- `$(elements).removeClass(ssv)`

- `$(elements).toggleClass(ssv, force?)`

- `$(elements).hasClass(token)` → `true` if **any** element has it

#### Standalone syntax

In standalone usage, these methods can be run via [`.call`](https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Function/call)

- `vibe.fn.addClass.call(stack, ssv)`

- `vibe.fn.removeClass.call(stack, ssv)`

- `vibe.fn.toggleClass.call(stack, ssv, force?)`

- `vibe.fn.hasClass.call(stack, token)`

## Ender 

#### Include [vibe](https://www.npmjs.org/package/vibe) in your [ender](https://github.com/ender-js/Ender) build

```sh

ender build vibe

```

#### `ender` usage example

```js

ender('html').addClass('example').removeClass('another')

```

## Compatibility

- Works in all browsers. Tested in Chrome, FF, Opera, IE7/8

- Uses the native `.classList` where available and otherwise uses `.className`

## Fund

Support this project by [tipping the developer](https://www.gittip.com/ryanve/) =)

## License

[MIT](vibe.js#L4)