Resources

Contents

• Home
• Downloads
• Documentation
  • API Reference
  • Object Reference
• Examples
• Builder
• Build Test
• Speed Tests
• Sponsors

Related Links

• Donations
• Discussion
• Repository

Primers

• Attributes
• Host
• Keyboard
• Position
• Size
• Viewport

Bookmark

• Digg This
• Add to deli.cio.us

Javascript Help

• Newsgroup
• FAQ

My Library Object Reference

This is the reference for the object-oriented interface, which is built on top of the functional API. Typically, each method wraps a single API function, though some (e.g. anchors) wrap multiple functions. The relationships between the two interfaces are cross-referenced for convenient comparison.

Note this document is a work in progress. We ask that you please bear with us.

• C
  • changed
  • getValue
• D
  • addStyleRule
  • anchors
  • body
  • children
  • clientRectangle
  • create
  • createWithAttributes
  • createWithProperties
  • deleteCookie
  • descendants
  • forms
  • getCookie
  • getScrollPosition
  • head
  • html
  • htmlElement
  • images
  • isXhtml
  • links
  • load
  • node
  • off
  • on
  • onReady
  • query
  • scrollRectangle
  • scrollSize
  • setActiveStyleSheet
  • setCookie
  • setScrollPosition
  • window
• E
  • absolute
  • addClass
  • addHtml
  • addText
  • adjacent
  • appendTo
  • attachDrag
  • border
  • borders
  • center
  • children
  • clone
  • containedBy
  • coverDocument
  • descendants
  • detachDrag
  • dispatch
  • document
  • dropIn
  • dropOut
  • element
  • empty
  • fadeIn
  • fadeOut
  • foldIn
  • foldOut
  • fullScreen
  • getAttribute
  • getAttributeProperty
  • getComputedStyle
  • getOpacity
  • getPosition
  • getSize
  • getStyle
  • getText
  • getTransformMatrix
  • growIn
  • growOut
  • hasAttribute
  • hasClass
  • html
  • htmlOuter
  • initiateDrag
  • insertAfter
  • insertBefore
  • isAncestor
  • isDescendant
  • isPresent
  • isTag
  • isVisible
  • loadClone
  • loadHtml
  • loadNew
  • loadNext
  • loadPrevious
  • margin
  • margins
  • maximize
  • off
  • offContextClick
  • offHelp
  • on
  • onContextClick
  • onHelp
  • onRoll
  • overlaps
  • overlay
  • position
  • positionStyle
  • present
  • query
  • relative
  • remove
  • removeAttribute
  • removeClass
  • replace
  • restore
  • setAttribute
  • setAttributeProperty
  • setAttributes
  • setHtml
  • setOpacity
  • setOuterHtml
  • setStyle
  • setStyles
  • setText
  • show
  • size
  • sizeOuter
  • sizeStyle
  • springIn
  • springOut
  • toggle
  • togglePresence
  • update
• F
  • changed
  • controls
  • send
  • serialize
• I
  • change
• Q
  • addClass
  • addHtml
  • addMe
  • append
  • appendTo
  • clear
  • copy
  • dropIn
  • dropOut
  • empty
  • evens
  • every
  • fadeIn
  • fadeOut
  • filter
  • find
  • first
  • foldIn
  • foldOut
  • forEach
  • growIn
  • growOut
  • hasAttribute
  • hasClass
  • indexOf
  • inject
  • insertAfter
  • insertBefore
  • last
  • loadHtml
  • map
  • odds
  • off
  • offContextClick
  • offHelp
  • on
  • onContextClick
  • onHelp
  • onRoll
  • pop
  • position
  • prepend
  • present
  • push
  • random
  • remove
  • removeAttribute
  • removeClass
  • reverse
  • setAttribute
  • setAttributeProperty
  • setHtml
  • setOpacity
  • setStyle
  • setStyles
  • setText
  • shift
  • show
  • size
  • sizeOuter
  • slice
  • snip
  • some
  • splice
  • toHtml
  • toggle
  • togglePresence
  • unshift
• W
  • addBookmark
  • addBookmarkCurrent
  • getEnabledPlugin
  • getFrameById
  • getIFrameDocument
  • off
  • on
  • setStatus
  • viewportSize

C

The C function constructs an object that abstracts a form control. This constructor inherits from E.

Note to always use with the new operator if calling the constructor from an alternate frame. Creating C objects from form controls in alternate frames does not require the new operator.

Syntax

c = C([el]);
c = new C([el]);

Examples

var c = C('myid');
var c = C(F('myform').controls('myinput'));
window.alert('Value is ' + c.getValue());

changed (C)

Syntax

b = c.changed();

Examples

b = C('mycontrol').changed();

Return Value

The method returns a boolean.

getValue (C)

Syntax

value = c.getValue([default]);

Examples

value = C('myid').getValue();
defaultValue = C('myid').getValue(true);

Return Value

The method returns a string or array.

D

The D function constructs an object that abstracts a document.

Note to always use with the new operator if calling the constructor from an alternate frame. Creating D objects from documents in alternate frames does not require the new operator.

Syntax

d = D([doc]);
d = new D([doc]);

Examples

var d = D();
window.alert(d.isXHTML());
d = D(doc);
d.onReady(function() { window.alert('Ready'); });
d.on('click', function() { this.setScrollPosition(100, 0); });
var q = d.query('.testclass');

addStyleRule (D)

Syntax

d.addStyleRule(selector, rule[, media])

Examples

D().addStyleRule('.myclass', 'color:#ff0000');
D(doc).addStyleRule('.myclass', 'color:#ff0000');
D().addStyleRule('fieldset', 'display:none', 'print');

Return Value

The method returns the D object.

anchors (D)

Syntax

a = d.anchors([i]);

Examples

anchors = D().anchors();
anchors = D(doc).anchors();
anchor = D().anchors(0);
anchor = D().anchors('myname');

Return Value

The method returns an array (or array-like host object) or a element.

Note array-like host objects are live collections, so handle with results with care. Use the toArray function to convert to an array.

body (D)

Syntax

el = d.body();

Examples

el = D().body();
el = D(doc).body();

Return Value

The method returns a body element.

children (D)

Syntax

c = d.children([i]);

Examples

children = D().children();
children = D(doc).children();
child = D().children(0);

Return Value

Normally, the method returns an array or an element; but, if the index (i) is out of bounds, it will return undefined.

clientRectangle (D)

Syntax

r = d.clientRectangle();

Examples

r = D().clientRectangle();
r = D(doc).clientRectangle();

Return Value

The method returns an array containing the top, left, height and width of the viewport.

create (D)

Syntax

el = D().create(tag);

Examples

el = D().create('div');
el = D(doc).createElement('div');

Return Value

The method returns an element.

createWithAttributes (D)

Syntax

el = D().createWithAttributes(tag, atts);

Examples

el = D().createWithAttributes('div', { id:'me', 'class':'hello' });
el = D(doc).createWithAttributes('div', { id:'you', 'class':'hello' });

Return Value

The method returns an element.

createWithProperties (D)

Syntax

el = D(el).createWithProperties(tag, props);

Examples

el = D().createElementWithProperties('input', { type:'checkbox', checked:true });
el = D(doc).createElementWithProperties('input', { type:'checkbox', checked:true });

Return Value

The method returns an element.

deleteCookie (D)

Syntax

d.deleteCookie(name[, path]);

Examples

D().deleteCookie('test');
D(doc).deleteCookie('test');

Return Value

The method returns the D object.

descendants (D)

Syntax

e = d.descendants(tag[, i]);

Examples

els = D().descendants('*');
els = D(doc).descendants('*');
el = D().descendants('div', 0);

Return Value

Normally, the method returns an array (or array-like host object) or element; but, if the index (i) is out of bounds, it will return undefined.

Note array-like host objects are live collections, so handle with results with care. Use the toArray function to convert to an array.

forms (D)

Syntax

e = d.forms([i]);

Examples

els = D().forms();
els = D(doc).forms();
el = D().forms(0);
el = D().forms('myname');

Return Value

The method returns an array (or array-like host object) or a form element.

Note array-like host objects are live collections, so handle with results with care. Use the toArray function to convert to an array.

getCookie (D)

Syntax

s = d.getCookie(name[, defaultValue[, encoded]]);

Examples

c = D().getCookie('test');
c = D(doc).getCookie('test');
c = D().getCookie('test', '');

Return Value

The method returns a string or null.

getScrollPosition (D)

Syntax

p = d.getScrollPosition();

Examples

p = D().getScrollPosition();
p = D(doc).getScrollPosition();

Return Value

The method returns an array containing the top and left scroll positions or null if the position cannot be determined.

head (D)

Syntax

el = d.head();

Examples

el = D().head();
el = D(doc).head();

Return Value

The method returns a head element.

html (D)

Syntax

s = d.html([xhtml]);

Examples

html = D().html();
html = D(doc).html();
xhtml = D(doc).html(true);

Return Value

The method returns a string.

htmlElement (D)

Syntax

el = d.htmlElement();

Examples

el = D().htmlElement();
el = D(doc).htmlElement();

Return Value

The method returns an html element.

images (D)

Syntax

e = d.images([i]);

Examples

els = D().images();
els = D(doc).images();
el = D().images(0);
el = D().images('myname');

Return Value

The method returns an array (or array-like host object) or img element.

Note array-like host objects are live collections, so handle with results with care. Use the toArray function to convert to an array.

isXhtml (D)

Syntax

b = d.isXhtml();

Examples

b = D().isXhtml();
b = D(doc).isXhtml();

Return Value

The method returns a boolean value.

links (D)

Syntax

e = d.links([i]);

Examples

els = D().links();
els = D(doc).links();
el = D().links(0);
el = D().links('myname');

Return Value

The method returns an array (or array-like host object) or a element.

Note array-like host objects are live collections, so handle with results with care. Use the toArray function to convert to an array.

load (D)

Syntax

d.load(doc);

Examples

D().load(doc);

Return Value

The method returns the D object.

node (D)

Syntax

doc = d.node();

Examples

doc = D().node();

Return Value

The method returns a document.

off (D)

Syntax

d.off(ev, fn);

Examples

D().off('click', fn);
D(doc).off('click', fn);

Return Value

The method returns the D object

on (D)

Syntax

d.on(ev, fn[, context]);

Examples

D().on('click', function() { window.alert('Hello again!'); });
D().on('click', function() { this.doSomething(); }, someObject);
D(doc).on('click', function() { this.doSomethingElse(); }, someObject);

Return Value

The method returns the D object

onReady (D)

Syntax

d.onReady(fn);

Examples

D(doc).onReady(function() { doSomething(); });
D(docOther).onReady(function() { doSomethingElse(); });

Return Value

The method returns the D object

query (D)

Syntax

q = d.query(selector);

Examples

q = D().query('div');
q = D(doc).query('div');
q = D().query('div div div');
q = D().query('.myclass');
q = D().query('#myid');
q = D().query('#myid p.myclass');
q = D().query('div:first-child');
q = D().query('div:only-child');
q = D().query('div:nth-child(5)');
q = D().query('h2 + div');
q = D().query('h2 + div#myid');
q = D().query('h2 ~ div#myid');

Return Value

The method returns a Q object.

scrollRectangle (D)

Syntax

r = d.scrollRectangle();

Examples

r = D().scrollRectangle();
r = D(doc).scrollRectangle();

Return Value

The function returns an array containing the top, left, height and width of the top-level rendered element (HTML or body).

scrollSize (D)

Syntax

r = d.scrollSize();

Examples

r = D().scrollRectangle();
r = D(doc).scrollRectangle();

Return Value

The function returns an array containing the height and width of the top-level rendered element (HTML or body).

setActiveStyleSheet (D)

Syntax

d.setActiveStyleSheet(id);

Examples

D().setActiveStyleSheet('winter');
D(doc).setActiveStyleSheet('winter');
D().setActiveStyleSheet('summer');

Return Value

The method returns the D object

setCookie (D)

Syntax

d.setCookie(name, value[, expires[, path[, secure]]]);

Examples

D().setCookie('myname', 'myvalue');
D(doc).setCookie('myname', 'myvalue');
D().setCookie('myname', 'myvalue', 7); // Expires in 7 days

Return Value

The method returns the D object

setScrollPosition (D)

Syntax

d.setScrollPosition(top, left[, isNormalized[, options[, callback]]]);

Examples

D().setScrollPosition(el, 0, 0);
D(doc).setScrollPosition(el, 0, 0);

Return Value

The method returns the D object

window (D)

Syntax

win = d.window();

Examples

win = D().window();
win = D(doc).window();

Return Value

The method returns a window object.

e = E(id);
e = new E(id);

var e = E(API.getHtmlElement());
e.onHelp(function() { window.alert('Help') }).onContextClick(function() { window.alert('Context click') });
e.load('testid');
e.fadeIn({ duration:1000 }).on('click', function() { window.alert('Clicked'); });
E().loadHtml('<div><strong>This is a test<\/strong><\/div>').appendTo(document.body);

e.absolute();

E('myid').absolute();
E(el).absolute();

e.addClass(className);

E('myid').addClass('myclass');
E(el).addClass('myclass');

e.addHtml(html);

E('myid').addHtml('<p>This is a test</p>');
E(el).addHtml('<p>This is also a test</p>');

e.addText(text);

E('myid').addText('Burma-Shave');
E(el).addText('Burma-Shave');

e.adjacent(el[, side]);

E('myid').adjacent(el);
E(el).adjacent(el2);
E('myid').adjacent(el, 'right');
E('myid').adjacent(el, 'top');

e.appendTo(el);

E('myid').appendTo(el);
E(el).appendTo(elContainer);

e.attachDrag([elHandle[, options]]);

E('myid').attachDrag();
E(el).attachDrag();
E(el).attachDrag(elHandle, { ondrop: function() { window.alert('Dropped!' } });

w = e.border(side);

i = E('myid').border('right');
i = E(el).border('right');
i = E('myid').border('top');

o = e.borders();

o = E('myid').borders();
o = E(el).borders();

e.center([options[, callback]]);

E(el).center();
E('myid').center();
E(el).center({ duration:1000, ease:API.ease.circle });
E(el).center({ duration:1000, ease:API.ease.circle }, fn);

c = e.children([i]);

c = E(el).children();
c = E('myid').children();
el = E(el).children(0);

el = e.clone([deep]);

el = E(el).clone();
el = E('myid').clone();
el = E(el).clone(true);

b = e.containedBy(el);

b = E(el).containedBy(elContainer);
b = E('myid').containedBy(elContainer);

e.coverDocument();

E(el).coverDocument();
E('myid').coverDocument();

o = e.descendants([tag[, i]]);

els = E(el).descendants();
els = E('myid').descendants();
els = E(el).descendants('div');
el = E(el).descendants('div', 0);

e.detachDrag([elHandle]);

E(el).detachDrag();
E('myid').detachDrag();
E(el).detachDrag(elHandle);

e.dispatch(ev[, evType]);

E(el).dispatch('click');
E('myid').dispatch('click');

doc = e.document();

doc = E(el).document();
doc = E('myid').document();

e.dropIn([options[, callback]]);

E(el).dropIn();
E('myid').dropIn();
E(el).dropIn({ ease:API.ease.circle, duration:1000 });
E(el).dropIn({ ease:API.ease.circle, duration:1000 }, fn);

e.dropOut([options[, callback]])

E(el).dropOut();
E('myid').dropOut();
E(el).dropOut({ ease:API.ease.circle, duration:1000 });
E(el).dropOut({ ease:API.ease.circle, duration:1000 }, fn);

e.empty();

E(el).empty();
E('myid').empty();

el = e.element();

el = E(el).element();
E('myid').element();

e.fadeIn([options[, callback]]);

E(el).fadeIn();
E('myid').fadeIn();
E(el).fadeIn({ ease:API.ease.circle, duration:1000 });
E(el).fadeIn({ ease:API.ease.circle, duration:1000 }, fn);

e.fadeOut([options[, callback]]);

E(el).fadeOut();
E('myid').fadeOut();
E(el).fadeOut({ ease:API.ease.circle, duration:1000 });
E(el).fadeOut({ ease:API.ease.circle, duration:1000 }, fn);

e.foldIn([options[, callback]]);

E(el).foldIn();
E('myid').foldIn();
E(el).foldIn({ ease:API.ease.circle, duration:1000 });
E(el).foldIn({ ease:API.ease.circle, duration:1000 }, fn);

e.foldOut([options[, callback]]);

E(el).foldOut();
E('myid').foldOut();
E(el).foldOut({ ease:API.ease.circle, duration:1000 });
E(el).foldOut({ ease:API.ease.circle, duration:1000 }, fn);

e.fullScreen();

E(el).fullScreen();
E('myid').fullScreen();

s = e.getAttribute(name);

s = E(el).getAttribute('class');
s = E('myid').getAttribute('class');
s = E(el).getAttribute('style');

v = e.getAttributeProperty(name);

s = E(el).getAttributeProperty('class');
s = E('myid').getAttributeProperty('class');
b = E(el).getAttributeProperty('readonly');

s = e.getComputedStyle(style);

s = E(el).getComputedStyle('color');
s = E('myid').getComputedStyle('color');
s = E(el).getComputedStyle('backgroundColor');

o = e.getOpacity();

o = E(el).getOpacity();
o = E('myid').getOpacity();

p = e.getPosition();

p = E(el).getPosition();
p = E('myid').getPosition();

d = e.getSize();

d = E(el).getSize();
d = E('myid').getSize();

s = e.getStyle(style);

s = E(el).getStyle('color');
s = E('myid').getStyle('color');
s = E(el).getStyle('backgroundColor');

s = e.getText();

s = E(el).getText();
s = E('myid').getText();

e.growIn([options[, fnDone]]);

E(el).growIn();
E('myid').growIn();
E(el).growIn({ ease:API.ease.circle, duration:1000 });
E(el).growIn({ ease:API.ease.circle, duration:1000 }, fn);

e.growOut([options[, fnDone]]);

E(el).growOut();
E('myid').growOut();
E(el).growOut({ ease:API.ease.circle, duration:1000 });
E(el).growOut({ ease:API.ease.circle, duration:1000 }, fn);

b = e.hasAttribute(name);

b = E(el).hasAttribute('class');
b = E('myid').hasAttribute('class');

b = e.hasClass(className);

b = E(el).hasClass('myclass');
b = E('myid').hasClass('myclass');

s = e.html([xhtml]);

html = E(el).html();
html = E('myid').html();
xhtml = E(el).html(true);

s = e.htmlOuter([xhtml]);

html = E(el).htmlOuter();
html = E('myid').htmlOuter();
xhtml = E(el).htmlOuter(true);

e.initiateDrag();

E(el).initiateDrag();
E('myid').initiateDrag();

e.insertAfter(el);

E(elInsert).insertAfter(el);
E('myid').insertAfter(el);

e.insertBefore(el);

E(elInsert).insertBefore(el);
E('myid').insertBefore(el);

b = e.isAncestor(el);

b = E(elAncestor).isAncestor(el);
b = E('myid').isAncestor(el);

b = e.isDescendant(el);

b = E('myid').isDescendant(elAncestor);
b = E(el).isDescendant(elAncestor);

b = e.isPresent();

b = E(el).isPresent();
b = E('myid').isPresent();

b = e.isTag(tag);

b = E(el).isTag('div');

b = e.isVisible();

b = E(el).isVisible();
b = E('myid').isVisible();

e.load(el);

E().load(el);
E().load('myid');

e.loadClone(deep);

E(el).loadClone();

e.loadHtml(html[, docNode]);

E().loadHtml('<p>And then...</p>');

e.loadNew(tag, attributesOrProperties, setProperties);

E().loadNew('div', { id:'you', 'class':'goodbye', disabled:'disabled' });

e.loadNext();

E(el).loadNext();

e.loadPrevious();

E(el).loadPrevious();

i = e.margin(side);

i = E(el).margin('left');
i = E('myid').margin('left');
i = E(el).margin('top');

o = e.margins();

o = E(el).margins();
o = E('myid').margins();

e.maximize([options[, callback]]);

E(el).maximize();
E('myid').maximize();

e.off(ev, fn);

E(el).off('click', function() { window.alert('Clicked'); });
E('myid').off('click', function() { window.alert('Also clicked'); });

e.offContextClick();

E(el).offContextClick();;
E('myid').offContextClick();;

e.offHelp();

E(el).offHelp();
E('myid').offHelp();

e.on(ev, fn[, context]);

E(el).on('click', function() { window.alert('Clicked'); });
E('myid').on('click', function() { window.alert('Also clicked'); });
E(el).on('click', function() { this.log('Object clicked'); }, someObject);

E(id).onContextClick(fn[, context])

E(el).onContextClick(function() { window.alert('Context clicked'); });
E('myid').onContextClick(function() { window.alert('Also context clicked'); });
E(el).onContextClick(function() { this.log('Context clicked'); }, someObject);

e.onHelp(fn[, context]);

E(el).onHelp(function() { window.alert('Help!'); });
E('myid').onHelp(function() { window.alert('Help yourself!'); });
E(el).onHelp(function(e) { this.showHelp(); }, someObject);

e.onRoll(fnOver, fnOut[, context[, bAttachFocusListeners[, bSetStatus]]]);

E(el).onRoll(function() { window.status = 'over'; }, function() { window.status = 'and out'; } );
E('myid').onRoll(function() { window.status = 'roger'; }, function() { window.status = 'that'; } );
E(el).onRoll(function(e) { this.onover(e); }, function(e) { this.onout(e); }, someObject);

b = e.overlaps(el);

b = E(elOverlay).overlaps(el);

e.overlay(el[, cover])

E(elOverlay).overlay(el);
E('myid').overlay(el);
E(elOverlay).overlay(el, true);

e.position(y, x[, options[, callback]])

E(el).position(100, 100);
E('myid').position(0, 0);
E(el).position(100, 100, { duration:1000, ease:API.ease.circle });

p = e.positionStyle();

p = E(el).positionStyle();
p = E('myid').positionStyle();

e.present(b[, display]);

E(el).present();
E(el).present(false);
E(el).present(true, 'block');
E(el).present(true, 'inline');

q = e.query(s);

q = E(el).query('div');
q = E('myid').query('div');
q = E(el).query('.myclass');

e.relative();

E(el).relative();
E('myid').relative();

e.remove();

E(el).remove();
E('myid').remove();

e.removeAttribute(name);

E(el).removeAttribute('class');
E('id').removeAttribute('class');
E(el).removeAttribute('style');

e.removeClass(className);

E(el).removeClass('someclass');
E('myid').removeClass('someclass');
E(el).removeClass('someclass').removeClass('someotherclass');

e.replace(el);

E(elReplacement).replace(el);
E('myid').replace(el);

e.restore([options[, callback]]);

E(el).restore();
E('myid').restore();
E(el).restore({ duration:1000, ease:API.ease.circle });

e.setAttribute(name, value);

E(el).setAttribute('class', 'myclass');
E(el).setAttribute('checked', 'checked');
E(el).setAttribute('tabindex', '2');

e.setAttributeProperty(name, value);

E(el).setAttributeProperty('class', 'myclass');
E(el).setAttributeProperty('checked', true);
E(el).setAttributeProperty('tabindex', 2);

e.setAttributes(attributes);

E(el).setAttributes({
  class: 'myclass',
  checked: 'checked',
  tabindex: '2'
});

e.setHtml(html[, options[, callback]])

E(el).setHtml('<p>This is a test</p>');

e.setOpacity(o)

E(el).setOpacity(0.5);

e.setOuterHtml(html, options, fnDone)

E(el).setOuterHtml('<p>This is a test</p>');

e.setStyle(style, value)

E(el).setStyle('color', '#ff0000');

e.setStyles(styles)

E(el).setStyles({
  color: '#ff0000',
  backgroundColor: '#0000ff'
});

e.setText(text);

E(el).setText('This is a test');
E('myid').setText('This is a test');

e.show(b[, options[, callback]]);

E(el).show();
E('myid').show();
E(el).show(false);

e.size(h, w[, options[, callback]);

E(el).size(100, 100);
E('myid').size(100, 100);

e.sizeOuter(h, w);

E(el).sizeOuter(100, 100);
E('myid').sizeOuter(100, 100);

d = e.sizeStyle();

d = E(el).sizeStyle();
d = E('myid').sizeStyle();

e.springIn(elFrom[, options[, callback]]);

E(elPopup).springIn(el);
E('myid').springIn(el);

e.springOut(elFrom[, options[, callback]]);

E(elPopup).springOut(el);
E('myid').springOut(el);

e.toggle([options[, callback]]);

E(el).toggle();

e.togglePresence([display]);

E(el).togglePresence();
E(el).togglePresence('inline');
E(el).togglePresence('block');

e.update(uri, bAppend, updateOptions, fnUpdate, fnUpdated, requester)

E(el).update('http://www.cinsoft.net/');
E(el).update('http://www.cinsoft.net/', true);
E(el).update('http://www.cinsoft.net/', false, {
  effects: API.effects.fade,
  duration: 1000
});

F

The F function constructs an object that abstracts a form element. This constructor inherits from E.

Note to always use with the new operator if calling the constructor from an alternate frame. Creating F objects from forms in alternate frames does not require the new operator.

Syntax

f = F(id);
f = new F(id);

Examples

var s, f = F(0);
s = f.serialize();
f.send();

changed (F)

Syntax

b = f.changed();

Examples

b = F(0).changed();
b = F('myname').changed();

Return Value

The method returns a boolean.

controls (F)

Syntax

e = f.controls(i);

Examples

els = F(0).controls();
els = F('myname').controls();
el = F('myname').controls(0);

Return Value

The method returns an array or an element.

send (F)

Syntax

f.send([json[, requester]])

Examples

F(0).send();
F('nyname').send();
F(0).send(true);
F(0).send(true, requester);

Return Value

The method returns the F object.

serialize (F)

Syntax

s = f.serialize();

Examples

s = F(0).serialize();
s = F('myname').serialize();

Return Value

The method returns a string.

I

The I function constructs an object that abstracts an image element. This constructor inherits from E.

Note to always use with the new operator if calling the constructor from an alternate frame. Creating I objects from images in alternate frames does not require the new operator.

Syntax

i = I(id);
i = new I(id);

Examples

var i = I(0);
i.loadURI('testuri').slideIn({ duration:1000 }).on('click', function() { window.alert('Image clicked'); });

change (I)

Syntax

i.change(src[, options[, callback]])

Examples

I.change('http://www.cinsoft.net/images/cinsoft.gif');
I.change('http://www.cinsoft.net/images/cinsoft.gif', { effects: API.effects.fade, duration:1000, ease:API.ease.circle });
I.change('http://www.cinsoft.net/images/cinsoft.gif', { effects: [API.effects.fade, API.effects.grow], duration:1000, ease:API.ease.circle });

Return Value

The method returns the I object.

Q

The Q function constructs an object that abstracts multiple elements.

Note to always use with the new operator if calling the constructor from an alternate frame. Creating Q objects that query documents in alternate frames does not require the new operator.

Syntax

q = Q(selector[, node]);
q = new Q(selector[, node]);

Examples

var q = Q('div:last-child');
q.addClass('testclass').zoomIn({ duration:1000 }).on('click', function() { window.alert('Clicked'); });
q.load('div>div').addClass('testclass2').fadeIn({ duration:1000 }).on('click', function() { E(this).verticalBlindsOut({ duration:1000 }); });
q.load("#two.test1[test=test][test2]:first-child").slideIn({ duration:1000 }).on('click', function() { this.fadeOut({ duration:1000 }); }, q);
var q2 = Q([el1, el2, el3]);

addClass (Q)

Syntax

q.addClass(className);

Examples

Q('.myclass').addClass('yourclass');

Return Value

The method returns the Q object.

addHtml (Q)

Syntax

q.addHtml(html);

Examples

Q('.myclass').addHtml('<p></p>');

Return Value

The method returns the Q object.

addMe (Q)

Syntax

q.addMe([pos]);

Examples

Q('.myclass', el).addMe();
Q('.myclass', el).addMe(0);

Return Value

The method returns the Q object.

append (Q)

Syntax

q.append(selector[, node]);

Examples

Q('.myclass').append('.yourclass');

Return Value

The method returns the Q object.

appendTo (Q)

Syntax

q.appendTo(el);

Examples

Q('.myclass').appendTo(el);

Return Value

The method returns the Q object.

clear (Q)

Syntax

q.clear();

Examples

Q('.myclass').clear();

Return Value

The method returns the Q object.

copy (Q)

Syntax

r = q.copy();

Examples

r = Q('.myclass').copy()

Return Value

The method returns a new Q object.

dropIn (Q)

Syntax

q.dropIn([options[, callback]]);

Examples

Q('.myclass').dropIn();

Return Value

The method returns the Q object.

dropOut (Q)

Syntax

q.dropOut([options[, callback]]);

Examples

Q('.myclass').dropOut();

Return Value

The method returns the Q object.

empty (Q)

Syntax

q.empty();

Examples

Q('.myclass').empty();

Return Value

The method returns the Q object.

evens (Q)

Syntax

q.evens();

Examples

Q('.myclass').evens();

Return Value

The method returns the Q object.

every (Q)

Syntax

q.every(fn[, context]);

Examples

Q('.myclass').every(function(el) { return API.hasClass(el, 'yourclass'); });

Return Value

The method returns the Q object.

fadeIn (Q)

Syntax

q.fadeIn([options[, callback]]);

Examples

Q('.myclass').fadeIn();

Return Value

The method returns the Q object.

fadeOut (Q)

Syntax

q.fadeOut([options[, callback]]);

Examples

Q('.myclass').fadeOut();

Return Value

The method returns the Q object.

filter (Q)

Syntax

q.filter(fn[, context]);

Examples

Q('.myclass').filter(function() { return API.hasClass(el, 'yourclass'); });

Return Value

The method returns the Q object.

find (Q)

Syntax

r = q.find(selector);

Examples

r = Q('.myclass', el)
r = r.find('.yourclass');

Return Value

The method returns a new Q object.

first (Q)

Syntax

el = q.first();

Examples

el = Q('.myclass').first();

Return Value

The method returns an element.

foldIn (Q)

Syntax

q.foldIn([options[, callback]]);

Examples

Q('.myclass').foldIn();

Return Value

The method returns the Q object.

foldOut (Q)

Syntax

q.foldOut([options[, callback]]);

Examples

Q('.myclass').foldOut();

Return Value

The method returns the Q object.

forEach (Q)

Syntax

q.forEach(fn, context);

Examples

Q('.myclass').forEach(function() { API.addClass(el, 'yourclass'); });

Return Value

The method returns the Q object.

growIn (Q)

Syntax

q.growIn([options[, callback]]);

Examples

Q('.myclass').growIn();

Return Value

The method returns the Q object.

growOut (Q)

Syntax

q.growOut([options[, callback]]);

Examples

Q('.myclass').growOut();

Return Value

The method returns the Q object.

hasAttribute (Q)

Syntax

b = q.hasAttribute(name);

Examples

b = Q('.myclass').hasAttribute('style');

Return Value

The method returns a boolean.

hasClass (Q)

Syntax

b = q.hasClass(className);

Examples

b = Q('.myclass').hasClass('yourclass');

Return Value

The method returns a boolean.

indexOf (Q)

Syntax

i = q.indexOf(el);

Examples

i = Q('.myclass').indexOf(el);

Return Value

The method returns a number.

inject (Q)

Syntax

q.inject(pos[, selector[, node]]);

Examples

Return Value

The method returns the Q object.

insertAfter (Q)

Syntax

q.insertAfter(el);

Examples

Return Value

The method returns the Q object.

insertBefore (Q)

Syntax

q.insertBefore(el);

Examples

Return Value

The method returns the Q object.

last (Q)

Syntax

el = q.last();

Examples

el = Q('.myclass').last();

Return Value

The method returns an element or undefined if the query is empty.

loadHtml (Q)

Syntax

q.loadHtml(html[, docNode]);

Examples

Q().loadHtml('<p></p>');
Q().loadHtml('<p></p><div></div>');

Return Value

The method returns the Q object.

map (Q)

Syntax

a = q.map(fn[, context]);

Examples

a = Q('.myclass').map(function(el) { return el.id; });

Return Value

The method returns an array.

odds (Q)

Syntax

q.odds();

Examples

Q(.myclass').odds();

Return Value

The method returns the Q object.

off (Q)

Syntax

q.off(ev, fn);

Examples

Return Value

The method returns the Q object.

offContextClick (Q)

Syntax

q.offContextClick();

Examples

Q('.myclass').offContextClick();

Return Value

The method returns the Q object.

offHelp (Q)

Syntax

q.offHelp();

Examples

Q('.myclass').offHelp();

Return Value

The method returns the Q object.

offMousewheel (Q)

Syntax

q.offMousewheel();

Examples

Q('.myclass').offMousewheel();

Return Value

The method returns the Q object.

on (Q)

Syntax

q.on(ev, fn[, context]);

Examples

Q('.myclass').on('click', function() { window.alert('Clicked'); });

Return Value

The method returns the Q object.

onContextClick (Q)

Syntax

q.onContextClick(fn, context);

Examples

Return Value

The method returns the Q object.

onHelp (Q)

Syntax

q.onHelp(fn[, context]);

Examples

Q('.myclass').onHelp(function() { window.alert('Help!'); });

Return Value

The method returns the Q object.

onMousewheel (Q)

Syntax

q.onMousewheel(fn[, context]);

Examples

Q('.myclass').onMousewheel(function(e, delta) { window.status = delta; });

Return Value

The method returns the Q object.

onRoll (Q)

Syntax

q.onRoll(fnOver[, fnOut[, context[, attachFocusListeners[, setStatus]]]]);

Examples

Q('.myclass').onRoll(function() { window.alert('over'); }, function() { window.alert('out'); });

Return Value

The method returns the Q object.

pop (Q)

Syntax

el = q.pop();

Examples

el = Q('.myclass').pop();

Return Value

The method returns an element or undefined if the query is empty.

position (Q)

Syntax

q.position(top[, left])

Examples

Q('.myclass').position(100, 100);
Q('.yourclass').position(0, 0);

Return Value

The method returns the Q object.

prepend (Q)

Syntax

q.prepend(selector[, node]);

Examples

Q('p').prepend('div');
Q('.myclass').prepend('.yourclass');

Return Value

The method returns the Q object.

present (Q)

Syntax

q.present(b[, display]);

Examples

Q(.myclass').present();
Q(.yourclass').present(false);
Q(.myclass').present(true, 'block');
Q(.myclass').present(true, 'inline');

Return Value

The method returns the Q object.

push (Q)

Syntax

q.push(el1, [el2, ..., elN]);

Examples

Q('.myclass').push(el);
Q('.myclass').push(el1, el2);

Return Value

The method returns the Q object.

random (Q)

Syntax

el = q.random();

Examples

el = Q('.myclass').random();

Return Value

The method returns an element.

remove (Q)

Syntax

q.remove();

Examples

Q('.myclass').remove();

Return Value

The method returns the Q object.

removeAttribute (Q)

Syntax

q.removeAttribute(name);

Examples

Q('.myclass').removeAttribute('class');

Return Value

The method returns the Q object.

removeClass (Q)

Syntax

q.removeClass(className);

Examples

Q('.myclass').removeClass('myclass');

Return Value

The method returns the Q object.

reverse (Q)

Syntax

q.reverse();

Examples

Q('.myclass').reverse()

Return Value

The method returns the Q object.

setAttribute (Q)

Syntax

q.setAttribute(name, value);

Examples

Q('.myclass').setAttribute('disabled', 'disabled');
Q('.myclass').setAttribute('title', 'This control is disabled.');

Return Value

The method returns the Q object.

setAttributeProperty (Q)

Syntax

q.setAttributeProperty(name, value);

Examples

Q('.myclass').setAttributeProperty('disabled', true);
Q('.myclass').setAttributeProperty('title', 'This control is disabled.');

Return Value

The method the Q object.

setHtml (Q)

Syntax

q.setHtml(html);

Examples

Q('.myclass').setHtml('<p></p>');

Return Value

The method returns the Q object.

setOpacity (Q)

Syntax

q.setOpacity(o);

Examples

Q('.myclass').setOpacity(0.5);
Q('.yourclass').setOpacity(0.75);

Return Value

The method returns the Q object.

setStyle (Q)

Syntax

q.setStyle(style, value);

Examples

Q('.myclass').setStyle('backgroundColor', '#000');

Return Value

The method returns the Q object.

setStyles (Q)

Syntax

q.setStyles(styles);

Examples

Q('.myclass').setStyles({ color:'#F00', backgroundColor:'#000' });

Return Value

The method returns the Q object.

setText (Q)

Syntax

q.setText(text);

Examples

Q('.myclass').setText('This is a test.');

Return Value

The method returns the Q object.

shift (Q)

Syntax

el = q.shift();

Examples

el = Q('.myclass').shift();

Return Value

The method returns the Q object.

show (Q)

Syntax

q.show(b[, options[, callback]]);

Examples

Q('.myclass').show();
Q('.myclass').show({ effects:API.effects.fade, duration:1000, ease:API.ease.circle });

Return Value

The method returns the Q object.

size (Q)

Syntax

q.size(h, w[, options[, callback]]);

Examples

Q('.myclass').size(100, 100);
Q('.myclass').size(100, 100, { duration:1000, ease:API.ease.circle });

Return Value

The method returns the Q object.

sizeOuter (Q)

Syntax

q.sizeOuter(h, w);

Examples

Q('.myclass').sizeOuter(100, 100);

Return Value

The method returns the Q object.

slice (Q)

Syntax

q.slice(begin[, end]);

Examples

Q('.myclass').slice(1);
Q('.myclass').slice(0, 1);

Return Value

The method returns the Q object.

snip (Q)

Syntax

q.snip(pos, count);

Examples

Q('.myclass').snip(0, 1);

Return Value

The method returns the Q object.

some (Q)

Syntax

b = q.some(fn[, context]);

Examples

b = Q('.myclass').some(function(el) { return API.hasClass(el, 'yourclass'); });

Return Value

The method returns a boolean.

splice (Q)

Syntax

q.splice(index, howMany, [el1][el2, ..., elN]);

Examples

Q('.myclass').splice(1, 2);
Q('.myclass').splice(1, 2, el);

Return Value

The method returns the Q object.

toHtml (Q)

Syntax

s = q.toHtml([xhtml]);

Examples

html = q.toHtml();
xhtml = q.toHtml(true);

Return Value

The method returns a string.

toggle (Q)

Syntax

q.toggle([options[, callback]]);

Examples

Q('.myclass').toggle();
Q('.yourclass').toggle({ effects:API.effects.fade, duration:1000 });

Return Value

The method returns the Q object.

togglePresence (Q)

Syntax

q.togglePresence([display]);

Examples

Q('.myclass').togglePresence();
Q('.myclass').togglePresence('block');
Q('.yourclass').togglePresence('inline');

Return Value

The method returns the Q object.

unshift (Q)

Syntax

q.unshift(el1[, el2, ..., elN]);

Examples

Q('.myclass').unshift(el1, el2, el3, el4);

Return Value

The method returns the Q object.

W

The W function constructs an object that abstracts a window.

Note to always use with the new operator if calling the constructor from an alternate frame. Creating W objects from alternate frames does not require the new operator.

Syntax

w = W([window]);
w = new W([window]);

Examples

var w = W();
var s = w.getViewportSize();
w.setStatus('Viewport size ' + s);
w.addBookmark('http://www.cinsoft.net/mylib.html', 'My Library');

addBookmark (W)

Syntax

w.addBookmark(uri[, title]);

Examples

W().addBookmark('http://www.hartkelaw.net', 'Hartke Law Firm')
W(win).addBookmark('http://www.hartkelaw.net', 'Hartke Law Firm')

Return Value

The method returns the W object.

addBookmarkCurrent (W)

Syntax

w.addBookmarkCurrent();

Examples

W().addBookmarkCurrent()
W(win).addBookmarkCurrent()

Return Value

The method returns the W object.

getEnabledPlugin (W)

Syntax

p = w.getEnabledPlugin(mimeType[, title]);

Examples

p = W().getEnabledPlugin('audio/x-wav');
p = W(win).getEnabledPlugin('audio/x-wav');

Return Value

The function returns a string or null if an enabled plugin is not found.

getFrameById (W)

Syntax

frame = w.getFrameById(id);

Examples

frame = W().getFrameById('myid');
frame = W(win).getFrameById('myid');

Return Value

The method returns a window object or null if none is found.

getIFrameDocument (W)

Syntax

doc = w.getIFrameDocument(el);

Examples

doc = W().getIFrameDocument(el);
doc = W(win).getIFrameDocument(el);

Return Value

The method returns a document.

off (W)

Syntax

w.off(ev, fn);

Examples

W().off('resize', fn);
W(win).off('resize', fn);
W().off('scroll', fn);

Return Value

The method returns the W object.

on (W)

Syntax

w.on(ev, fn[, context]);

Examples

W().on('resize', function() { window.status = 'Resized'; });
W(win).on('resize', function() { window.status = 'Resized'; });
W().on('scroll', function(e) { this.onscroll(e); }, someObject);

Return Value

The method returns the W object.

setStatus (W)

Syntax

w.setStatus(text);

Examples

W().setStatus('Hello!');

W(win).setStatus('Hello to you!');

Return Value

The method returns the W object.

viewportSize (W)

Syntax

s = w.viewportSize();

Examples

s = W().viewportSize();
s = W(win).viewportSize();

Return Value

The method returns an array containing the height and width of the viewport in pixels.

Last Modified: 23 Apr 2010 22:29:00 GMT