Instance Settings

Customise each targetted division with the settings below (all are optional):

$(selector).imagecube({..., ...});

afterRotate | beforeRotate | direction | easing | expansion | full3D | imagePath | letterSpacing | lineHeight | opacity | pause | randomSelection | reduction | repeat | segments | selection | shading | speed

NameTypeDefaultComments
directionstring'random' The direction in which to rotate the cube. Possible values are 'random', 'up', 'down', 'left', 'right'. Random chooses one of randomSelection for each transition.
randomSelectionstring[] ['up', 'down', 'left', 'right'] If the direction is 'random', then select one of these directions for each rotation of the cube. Possible values are 'up', 'down', 'left', 'right'.
speednumber2000 The number of milliseconds that it takes for each rotation to complete.
easingstring'linear' The name of the easing to use for the rotation animation. This can be one of the jQuery UI effects when this code is included.
repeatbooleantrue Set to true to automatically rotate the cube to a new image after pausing the time below. Set to false to only rotate on demand.
pausenumber2000 The number of milliseconds to pause between rotations of the cube.
selectionstring'forward' Determine how the next image to be shown is selected. The value should be one of 'forward', 'backward', or 'random'.

Since 1.1.0.
shadingbooleantrue Set to true to add the shading for enhancing the 3D effects. Set to false to not apply shading.

Since 1.0.1.
Since 1.2.0 - previously it was noShading with the opposite initial value and sense.
opacitynumber0.8 The maximum opacity for the highlight and shadow. Valid values are 0.0 to 1.0.

Since 1.2.0 - previously it was an array of minimum to maximum.
imagePathstring'' Any extra path information required to locate the highlight and shadow images used by IE for the shading effects.

Since 1.0.1.
full3Dbooleantrue Set to true to display a full 3D cube with perspective. Set to false to use the original ("flat") transition.

Since 1.2.0.
segmentsnumber20 The number of segments to use for the full3D effect. A higher number gives a smoother look to the cube but means more work for the animation.

Since 1.2.0.
reductionnumber30 The number of pixels by which the back edges of the cube are reduced for the full3D effect.

Since 1.2.0.
expansionnumber10 The number of pixels by which the front edge of the cube is expanded for the full3D effect.

Since 1.2.0.
lineHeightnumber[2][0.0, 1.25] The minimum and maximum line height (em) to use when "rotating" text.
letterSpacingnumber[2][-0.4, 0.0] The minimum and maximum letter spacing (em) to use when "rotating" text.
beforeRotatefunctionnull A callback made just before each rotation starts. The function receives the current (shown) and next (to be shown) elements as parameters, while this refers to the containing division.

Since 1.2.0.
afterRotatefunctionnull A callback made just after each rotation ends. The function receives the current (just hidden) and next (just displayed) elements as parameters, while this refers to the containing division.

$(selector).imagecube({afterRotate: endedRotate});
	
function endedRotate(current, next) {
	$('#rotateStatus').text('ended ' + $(current).attr('title') +
		' » ' + $(next).attr('title'));
}

Since 1.2.0.

Functions

current | destroy | next | option (get) | option (set) | rotate | setDefaults | start | stop

SignatureReturnsComments
$.imagecube.setDefaults(options)image cube object Update the default instance settings to use with all image cube instances.

options (object) is the set of default settings
$(selector).imagecube('option', options)jQuery object Update the settings for the image cube instance(s) attached to the given division(s).

options (object) the collection of new settings.

$(selector).imagecube('option', {speed: 1000, repeat: false});

Since 1.3.0 - previously you used the 'change' command.
$(selector).imagecube('option', name, value)jQuery object Update a particular setting for the image cube instance(s) attached to the given division(s).

name (string) the name of the setting to change;
value (any) the new value of that setting.

$(selector).imagecube('option', 'speed', 1000);

Since 1.2.0.
Since 1.3.0 - previously you used the 'change' command.
$(selector).imagecube('option', name)object or any Retrieve one or all of the current settings for the first image cube instance attached to the given division(s).

name (string, optional) the name of the setting to retrieve; omit for all settings.

var settings = $(selector).imagecube('option');
var speed = $(selector).imagecube('option', 'speed');

Since 1.3.0.
$(selector).imagecube('destroy')jQuery object Remove the image cube functionality from the given division(s).
$(selector).imagecube('rotate', next, callback)jQuery object Trigger another rotation on the image cube for the given division(s).

next (jQuery or element or string or number, optional) the next face to show, either as a jQuery object, the actual element, a selector for the face, or its index as a child of the container (starting at 0)

callback (function, optional) allows notification when the rotation has completed

Since 1.2.1 - added next.
$(selector).imagecube('stop')jQuery object Stop the automatic rotation of the image cube for the given division(s).
$(selector).imagecube('start')jQuery object Start the automatic rotation of the image cube for the given division(s).
$(selector).imagecube('current')element Retrieve the currently visible child element in the image cube for the given division.
$(selector).imagecube('next')element Retrieve the next child element in the image cube to be displayed for the given division.

Since 1.2.0.