Package Exports
- domkit/appendVendorPrefix
- domkit/getVendorPropertyName
- domkit/insertKeyframesRule
- domkit/throttle
- domkit/transitionEvents
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (domkit) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
DOM Kit
Toolkit for DOM
npm install domkit --saveinsertKeyframesRule
var insertKeyframesRule = require('domkit/insertKeyframesRule');
var keyframes = {
'0%': {
transform: 'scale(1)'
},
'50%': {
transform: 'scale(0.5)',
opacity: 0.7
},
'100%': {
transform: 'scale(1)',
opacity: 1
}
};
var animationName = insertKeyframesRule(keyframes);insertRule
var insertRule = require('domkit/insertRule');
var css = '.foo {}'
insertRule(css);appendVendorPrefix
var appendVendorPrefix = require('domkit/appendVendorPrefix');
var style = {
transform: 'scaleX(1)'
}
appendVendorPrefix(style);getVendorPrefix
var getVendorPrefix = require('domkit/getVendorPrefix');
var vendorPrefix = getVendorPrefix(); // => -webkit-addClass
var addClass = require('domkit/addClass');
addClass(this.getDOMNode(), 'foo');removeClass
var removeClass = require('domkit/removeClass');
removeClass(this.getDOMNode(), 'foo');hasClass
var hasClass = require('domkit/hasClass');
hasClass(this.getDOMNode(), 'foo'); // => truetransitionEventsa
var transitionEvents = require('domkit/transitionEvents');
transitionEvents.addEndEventListener(node, eventListener);
transitionEvents.removeEndEventListener(node, eventListener);classNames
var classNames = require('domkit/classNames');
classNames('foo', 'bar'); // => 'foo bar'
classNames('foo', { bar: true }); // => 'foo bar'
classNames({ foo: true }, { bar: true }); // => 'foo bar'
classNames({ foo: true, bar: true }); // => 'foo bar'
// lots of arguments of various types
classNames('foo', { bar: true, duck: false }, 'baz', { quux: true }) // => 'foo bar baz quux'
// other falsy values are just ignored
classNames(null, false, 'bar', undefined, 0, 1, { baz: null }, ''); // => 'bar 1'
// Arrays will be recursively flattened as per the rules above:
var arr = ['b', { c: true, d: false }];
classNames('a', arr); // => 'a b c'canUseDOM
var canUseDOM = require('domkit/canUseDOM');
if(canUseDOM){
// balabala
}addEventListener
var addEventListener = require('domkit/addEventListener');
addEventListener(window, 'scroll', handle)removeEventListener
var removeEventListener = require('domkit/removeEventListener');
removeEventListener(window, 'scroll', handle)throttle
var throttle = require('domkit/throttle');
throttle(fn, 100)onEndTransition
var onEndTransition = require('domkit/onEndTransition');
onEndTransition(el, handle)inViewport
var inViewport = require('domkit/inViewport');
inViewport(el) // true if elem is in the current viewport
inViewport(el, 100) // true if elem is in the current viewport or within 100px of it
inViewport(el, -100) // true if elem is in the current viewport and not within 99px of the edgeBrowser Support
![]() |
![]() |
![]() |
![]() |
![]() |
|---|---|---|---|---|
| IE 6+ ✔ | Chrome 4.0+ ✔ | Firefox 16.0+ ✔ | Opera 15.0+ ✔ | Safari 4.0+ ✔ |




