Array.js                         Element.js                          Element.Selectors.js               Element.Event.js  ...
Upcoming SlideShare
Loading in...5

Mootools 11 cheat_sheet


Published on

  • Be the first to comment

  • Be the first to like this

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Mootools 11 cheat_sheet

  1. 1. Array.js Element.js Element.Selectors.js Element.Event.js Drag.Base.js Drag.Move.js Array Utility Functions Utility Functions Event Drag.Base Drag.Move Cheat Sheet v1.1 * forEach(fn(el,i){}) $(el | s) $E(selector s, filter el) (shift,control,alt,meta,wheel, new Drag.Base(el, opt) new Drag.Move(el, opt) * filter(fn(el,i){}) $$(el a | id a | el | selector s) $ES(selector s, filter el) code,page.x,page.y,client.x, opt = { opt = { * map(fn(el,i){}) (any combination) client.y,key,target,relatedTarget) handle:el, all opt from Drag.Base, Core.js Element stop() modifiers: {styleX,styleY}, container el, * every(fn(el,i){}) Element getElements(singleSelector s) Functions * some(fn(el,i){}) stopPropagation() limit {[stX,endX],[stY,endY]} droppables el a, new Element(s, opt) getElement (selector s) > $E [,grid px, snap px] overflown el a $defined(o) * indexOf(el) preventDefault() set(opt) getElementsBySelector } } $type(o) each > forEach keys.eventName = keycode n opt = { (selector s) > $$ $merge(o [,o,..]) copy() “styles”: setStyles, Element Element Element getElementById(id s) > $ $extend(o, o) remove(el) “events”: addEvents, addEvent(e, fn) makeResizable(opt) makeDraggable(opt) $native(native o [,native o,...]) contains(el) “otherKey”: setProperty Element.Filters.js removeEvent(e, fn) opt > Drag.Base opt opt > Drag.Move opt $chk(o) associate(a) } Element addEvents({e:fn}) $pick(o, default o) extend(a) injectBefore(el) FX.Base.js FX.Elements.js filterByTag(tagname s) removeEvents([type s]) $random(min n, max n) merge(a) injectAfter(el) filterByClass(classname s) fireEvent(type s[,arg[], delay]) Fx.Base Fx.Elements $time() include(el) injectInside(el) cloneEvents(el [,type s]) new Fx.Base(opt) new Fx.Elements(el, opt) filterById(id s) $clear(timer) getRandom() injectTop(el) opt = { opt = all opt from FX.Base filterByAttribute(s [,op s,val s)) Function transition: Fx.Transitions, getLast() adopt(el) start({ Abstract (Singleton) Element.Form.js bindWithEvent(el [,arg[]]) duration: ms, index: {style:[from,to]} remove(el) Window Utility Functions unit: px | em | % }) clone(withChildnodes b) Element Custom Events (ie, ie6, ie7, gecko, webkit, $A() > copy() wait: waitForCurTransEnd b, replaceWith(el) getValue(), toQueryString() mouseenter, mouseleave webkit419, webkit420, opera) $each(a,fn(el,i){}) appendText(s) fps: framesPerSecond n, FX.Scroll.js onStart: fn, Class.js String.js hasClass(s) XHR.js Ajax.js onComplete: fn, Fx.Scroll String addClass(s), removeClass(s) XHR Ajax onCancel: fn new Fx.Scroll(el, opt) Class toggleClass(s) new XHR(url, opt) new Ajax(url, opt) } opt = { all opt from FX.Base, test(regex [,params]) new Class({fname: fn}) setStyle(style s, value s | n) opt = { all opt from XHR, offset {x,y}, toInt(), toFloat() opt = { start(from n, to n) empty() setStyles({style:value}) method: post | get, data: s, overflown el a camelCase() stop() extend({fname: fn}) async: asyncReq b update: el, } hyphenate() setOpacity(n) set(to n) implement({fname: fn}) encoding: s (default: utf-8), evalScripts: b, scrollTo(x,y) capitalize() getStyle(style s) autoCancel: b evalResponse: b FX.Style.js toTop(),toBottom() Class.Extras.js trim(), clean() getStyles(style s [,s,..]) headers: {hdName:hdCont} o onComplete: fn toRight(),toLeft() rgbToHex(returnArray b) getPrevious(), getNext() Fx.Style Chain onRequest: fn, } new Fx.Style(el, prop, opt) toElement(el) hexToRgb(returnArray b) getFirst(), getLast() chain(fn) onSuccess: fn, request() callChain() contains(s [,separator s]) getParent(), getChildren() onStateChange: fn, evalScripts() opt = all opt from FX.Base FX.Slide.js hasChild(el) start(from n, to n) clearChain() escapeRegExp() onFailure: fn getHeader(hdName s) Fx.Slide getProperty(prop s) } hide() Array new Fx.Slide(el, opt) Events removeProperty(prop s) Properties Object set(to n) opt = {all opt from FX.Base, addEvent(s, fn) rgbToHex() > rgbToHex toQueryString() getProperties(prop s [,s,...]) running, response Element mode: “vertical” | “horizontal” fireEvent(s[,arg[],delay ms]) hexToRgb() > hexToRgb setProterty(prop, value) setHeader(hdName s,hdVal s) Element effect(opt) > FX.Style } removeEvent(s, fn) Function.js setProperties({prop:value}) send() send() > for form-Elements slideIn(), slideOut() Options Function setHTML(html) cancel() FX.Styles.js hide(), show() setOptions(default opt, opt) create(opt) setText(s) Fx.Styles toggle() getText() Assets.js Cookie.js new Fx.Styles(el, opt) pass(arg[], [el]) Window.Size.js attempt(arg[], [el]) getTag() Assets Cookie opt = all opt from FX.Base FX.Transitions.js Window empty() new opt{domain s, path s, start({ bind(fn [,arg[]]) Fx.Transitions getWidth(), getHeight() javascript(src s, opt) duration days, secure b} style: [from n, to n] | to n bindAsEventListener([o,arg[]]) Element.Dimensions.js linear,Quad,Cubic,Quart,Quint, getScrollWidth() css(src s, opt) set(key s, value s, opt) }) delay(ms [,o,arg[]]) Pow,Expo,Circ,Sine,Back, getScrollHeight() Element image(src s, opt) get(cookieValue s) periodical(ms [,o,arg[]]) remove(cookieName s, opt) Element Bounce,Elastic getScrollLeft(),getScrollTop() scrollTo(x,y) images(srcs a, opt) each has easIn,easeOut,easeInOut Number.js effects(opt) > FX.Styles getSize() getSize() Number Json.js Json.Remote.js o ~ Object e ~ Event [ ] ~ optional getPosition([overflown el a]) s ~ String fn ~ Function | ~ choice / or Window.DomReady.js toInt(), toFloat() getTop([overflown el a]) Json Json.Remote a ~ Array el ~ Element > ~ see also Custom Events limit(min n, max n), round(n) getLeft([overflown el a]) toString(o) new Json.Remote(url, opt) n ~ Number opt ~ Options Object el a ~ Array of Elements evaluate(s, syntaxCheck b) opt = all opt from xhr domready times(fn) getCoordinates([overfl el a]) b ~ Boolean ms ~ Milliseconds {key:val} ~ o w/ key/val pairs
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.