turn.js
turn.js copied to clipboard
Changing the number of pages in the Steve Jobs example
I'm desperately trying to change the number of pages in the Steve Jobs example of TurnJS. I only have about 22 pages in my book but whenever I change the 'pages' value in the js I get odd results.
try this to generate them automatically
//page number if (page%2 == 0) { $('.even .footer').text(page); $('.odd .footer').text(page+1); } else { $('.even .footer').text(page-1); $('.odd .footer').text(page); }
Thanks for this Alxmerino, could you recommend where would be best to put this code?
The pages are currently defined on the page thusly:
flipbook.turn({ elevation: 50, acceleration: !isChrome(), autoCenter: true, gradients: true, duration: 1000, pages: 112,
Do I need to make a function within the pages option? Something like this...
pages: {
function() {
//page number
if (page%2 == 0) {
$('.even .footer').text(page);
$('.odd .footer').text(page+1);
} else {
$('.even .footer').text(page-1);
$('.odd .footer').text(page);
}
});
},
More or less something like this
flipbook.turn({
width: 960,
height: 600,
when: {
turning: function(e, page, view) {
var book = $(this),
currentPage = book.turn('page'),
pages = book.turn('pages');
//page number
if (page%2 == 0) {
$('.even .footer').text(page);
$('.odd .footer').text(page+1);
} else {
$('.even .footer').text(page-1);
$('.odd .footer').text(page);
}
}
}
}):
Hi adamlr,
flipbook.turn({ elevation: 50, acceleration: !isChrome(), autoCenter: true, gradients: true, duration: 1000, pages: 112,
Have this problem solved from your end? If please send me code too.......
Thanks in advance
Can archive it using the following steps
- In the HTML remove the following tow div. (are page number 111 & 112 static div)
- Now in the script - JS part (Change Pages to the respective number of page Eg. 10 or so)
flipbook.turn({ ...... .... duration: 1000, pages: 10,