i'm using this flipbook everything working fine but i need the slider to have certain specific pages 12 exactly, something like (1,10-11,20-21,30-11) im not sure what value i need to change.
( "#slider" ).slider({
min: 1,
max: 12, //had this value before
start: function(event, ui) {
if (!window._thumbPreview) {
_thumbPreview = $('<div />', {'class': 'thumbnail'}).html('<div></div>');
setPreview(ui.value);
_thumbPreview.appendTo($(ui.handle));
} else
setPreview(ui.value);
moveBar(false);
},
slide: function(event, ui) {
setPreview(ui.value);
},
stop: function() {
if (window._thumbPreview)
_thumbPreview.removeClass('show');
$('.magazine').turn('page', Math.max(1, $(this).slider('value')*2-2));
}
});
//////////////////////////////// this is magazine.js function setPreview(view) {
var previewWidth = 112,
previewHeight = 73,
previewSrc = 'pages/preview.jpg',
preview = $(_thumbPreview.children(':first')),
numPages = (view==1 || view==$('#slider').slider('option', 'max')) ? 1 : 2,
width = (numPages==1) ? previewWidth/2 : previewWidth;
_thumbPreview.
addClass('no-transition').
css({width: width + 15,
height: previewHeight + 15,
top: -previewHeight - 30,
left: ($($('#slider').children(':first')).width() - width - 15)/2
});
preview.css({
width: width,
height: previewHeight
});
if (preview.css('background-image')==='' ||
preview.css('background-image')=='none') {
preview.css({backgroundImage: 'url(' + previewSrc + ')'});
setTimeout(function(){
_thumbPreview.removeClass('no-transition');
}, 0);
}
preview.css({backgroundPosition:
'0px -'+((view-1)*previewHeight)+'px'
});
}