Skip to content
solidspark edited this page Mar 1, 2012 · 54 revisions

##Constructor

$('selector').turn([options]);

Creates an instance of turn.

Example: $('selector').turn({page:1});

Parameters:

options

  • width (type: number, default: $('selector').width())

  • height (type: number, default: $('selector').height())

  • page (type: number, default: 1)

  • shadows (type: boolean, default: true)

  • duration (type: number, default: 600)

  • acceleration (type: boolean, default: true)

###Calling methods or properties

$('selector').turn(property | method [, parameters]);

Properties

page

Gets the current page.

Example: alert($('selector').turn('page'));

view

Gets the current view. A view is basically an array of two values, in which the key [0] is the left page and [1] the right page. In cases where there is only one page, the value will be zero.

Example: alert($('selector').turn('view'));

Methods

page

Turns to a specific page. The page number must be a Number

Example: $('selector').turn('page', 2);

next

Turns to the next view.

Example: $('selector').turn('next');

previous

Turns to the previous view.

Example: $('selector').turn('previous');

stop

Stops the current page flip effect.

Example: $('selector').turn('next').turn('stop');

resize

Resets the size of all the wrappers used by turn.

Example: $('selector').turn('resize');

disable

Disables and enables the effect.

Example: $('selector').turn('disable', true);

size

Changes the size of the publication.

Example: $('selector').turn('size', 1000, 500);

Events

turning

Fired before a page starts turning.

Example: $('selector').bind('turning', function(e, page) { console.log(page+' says bye...'); });

turned

Fired when a page has been turned.

Example: $('selector').bind('turned', function(e, page, pageObj) { alert('Page turned to '+page); });

start

Fired before the folded page is showed.

Example: $('selector').bind('start', function(e, turn) { console.log('Is it turning?' + turn); });

end

Fired after the folded page is hidden.

Example: $('selector').bind('end', function(e) { });

CSS SubClasses

.p[0-9]+

You can use this subclass in order to add CSS attributes in a specific page.

Example:

Page 1 -> .p1

Page 2 -> .p2

.turn-page

You must use this subclass to define the size of all the pages.

##Examples

$('selector').turn('next').turn('next');

Passes two views from the current one.

$('selector').turn('next').turn('previous');

Nothing happens.

$('selector').turn('next').turn('stop');

Passes the current view to the next one without page flip effect.

Clone this wiki locally