Template resources

The template use several internal functions to determine how to work with the browser, and these are available for your scripts.

Browser type

The template does a bit of browser sniffing, and though this is not completely reliable, it helps sometimes.

$.template.ie7

True if Internet Explorer 7

$.template.ie8

True if Internet Explorer 8

$.template.iPhone

True if iPhone

$.template.iPod

True if iPod

$.template.iPad

True if iPad

$.template.iOs

True if iOs (any of iPhone, iPod or iPad)

$.template.android

True if Android

$.template.touchOs

True if OS designed for touch screens (iOs or Android)

Viewport size

The template uses a lot the viewport sizes, so they are retrieved and stored once here to speed up the whole scripts.

$.template.viewportWidth

Width of the available space

$.template.viewportHeight

Width of the available height (return the real value for iPhones, including the browser's chrome)

Fixed elements

The template provides a fallback for position:fixed, as it is used for the navigation menu but wasn't supported either by iOs before version 5 nor by older versions of Android.

The fallback works by adding elements with javascript:

$(selector).enableFixedFallback();

You can also disable it:

$(selector).disableFixedFallback();

Generic functions

$(selector).parseCSSValue(prop, def)

Parse a css numeric value

Parameters

@param jQuery element the element whose property to parse
@param string prop the name of the property
@param int def the default value if parsing fails (default: 0)

Return

@return the parsed css value, or def

$(selector).hasInlineCSS(prop)

Test if an element has an inline CSS property set

Parameters

@param string prop the name of the property

Return

@return boolean true if set, else false

$(selector).getStyleString()

Return the element inline style string
Note: for IE, the node.style.cssText is not raw, but as parsed by the browser (http://javascript.gakaa.com/style-csstext.aspx)

Return

@return string the style string

Reference

@url http://stackoverflow.com/questions/4233273/howto-get-cross-browser-literal-style-string-with-javascript

$(selector).filterFollowing(selector, fromLast)

Get immediate siblings matching a selector at the beginning of a selection:
The filter stops as soon as non-matching node is found

Parameters

@param string selector any jQuery selector string
@param boolean fromLast use true to filter from the last element (default: false)
@return the matching immediate siblings

$(selector).prevImmediates(selector)

Get immediate previous siblings matching a selector
Different from prevAll() as it stops as soon as non-matching node is found

Parameters

@param string selector any jQuery selector string

Return

@return the matching immediate previous siblings

$(selector).nextImmediates(selector)

Get immediate next siblings matching a selector
Different from nextAll() as it stops as soon as non-matching node is found

Parameters

@param string selector any jQuery selector string

Return

@return the matching immediate next siblings

$(selector).childrenImmediates(selector, fromLast)

Get immediate children siblings matching a selector
Different from nextAll() as it stops as soon as non-matching node is found

Parameters

@param string selector any jQuery selector string
@param boolean fromLast use true to filter from the last element (default: false)

Return

@return the matching immediate next siblings

Custom animations

$(selector).foldAndRemove(duration, callback)

Remove an element with folding effect

Parameters

@param string|int duration a string (fast, normal or slow) or a number of millisecond. Default: 'normal'. - optional
@param function callback any function to call at the end of the effect. Default: none. - optional

$(selector).fadeAndRemove(duration, callback)

Remove an element with fading then folding effect

Parameters

@param string|int duration a string (fast, normal or slow) or a number of millisecond. Default: 'normal'. - optional
@param function callback any function to call at the end of the effect. Default: none. - optional

$(selector).shake(force, callback)

Shake an element
The jQuery UI's bounce effect messes with margins so let's build ours

Parameters

@param int force size (in pixels) of the movement (default: 15)
@param function callback any function to call at the end of the effect. Default: none. - optional