vibe

jQuery-compatible CSS classes module

Usage no npm install needed!

<script type="module">
  import vibe from 'https://cdn.skypack.dev/vibe';
</script>

README

vibe

cross-browser [class] JavaScript module—uses classList where available

$ npm install vibe

API (0.9)

Parameters

  • element denotes a native DOM Element
  • token denotes a single class name
  • $ denotes a jQuery-compatible lib such as 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 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

  • 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 in your ender build

ender build vibe

ender usage example

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 =)

License

MIT