direction ltr and rtl don't seem to have an effect about bookblock

[finnbuster]

Also, what's a simple implementation of the plugin for multiple instances on the page all with the same class?

[ruddog]

For multiple instances you can give element (each slider) as parameter to function smth like:

var Page = (function(elem) {
var config = {
$bookBlock : $( '.bb-bookblock',elem ),
$navNext : $( '.bb-nav-next',elem ),
$navPrev : $( '.bb-nav-prev',elem ),
$navFirst : $( '.bb-nav-first' ,elem),
$navLast : $( '.bb-nav-last' ,elem)
}, .....
})();

take a look on demo https://github.com/codrops/BookBlock/blob/master/index.html , i hope you got the idea.

[finnbuster]

Am I misunderstanding the direction option? Does it not determine the direction that the animation of the pages play? I assumed that the direction would change the page motion from right to left to left to right as though you were reading a book backwards but the option doesn't seem to have any effect on that. I'm also hoping to achieve a reversed horizontal effect to achieve an effect similar to the old aeroplane schedule boards that flipped down. Help would be appreciated!

[ruddog]

Direction just change where the next page is from left or from right of current position,by default direction ltr in this project http://mag.walla.co.il/ we changed it to rtl and its work fine. Hope this helps.

[finnbuster]

I'd like to do something like this but it's not working. It performs one transtion with some weird artifacts (only half the flip is visiable and then it stops). What am I doing wrong?

$( '.bb-bookblock' ).each( function( i ) {

    var $bookBlock = $( this ),
        //$nav = $bookBlock.next().children( 'span' ),
        bb = $bookBlock.bookblock( {
            // speed : 600,
            // shadows : true,
            // shadowSides : 0.2,
            // shadowFlip  : 0.1,
            // vertical or horizontal flip
            orientation : 'horizontal',

            // ltr (left to right) or rtl (right to left)
            direction : 'ltr',

            // speed for the flip transition in ms.
            speed       : 1000,

            // easing for the flip transition.
            easing      : 'ease-in-out',

            // if set to true, both the flipping page and the sides will have an overlay to simulate shadows
            shadows     : true,

            // opacity value for the "shadow" on both sides (when the flipping page is over it).
            // value : 0.1 - 1
            shadowSides : 1,

            // opacity value for the "shadow" on the flipping page (while it is flipping).
            // value : 0.1 - 1
            shadowFlip  :1,

            // if we should show the first item after reaching the end.
            circular    : true,

            // if we want to specify a selector that triggers the next() function. example: '#bb-nav-next'.
            //nextEl      : '',

            // if we want to specify a selector that triggers the prev() function.
            //prevEl      : '',

            // If true it overwrites the circular option to true!
            autoplay        : true,

            // time (ms) between page switch, if autoplay is true. 
            interval        : 3000,

            // callback after the flip transition.
            // page is the current item's index.
            // isLimit is true if the current page is the last one (or the first one).
            //onEndFlip   : function( page, isLimit ) { return false; },

            // callback before the flip transition.
            // page is the current item's index.
            //onBeforeFlip: function( page ) { return false; }
        } );

} );

[liujihaozhy]

sorry,i don`t know

At 2013-11-04 05:11:30,finnbuster [email protected] wrote:

I'd like to do something like this but it's not working. It performs one transtion with some weird artifacts (only half the flip is visiable and then it stops). What am I doing wrong?

$('.bb-bookblock').each(function(i){var$bookBlock=$(this),//$nav = $bookBlock.next().children( 'span' ),bb=$bookBlock.bookblock({// speed : 600,// shadows : true,// shadowSides : 0.2,// shadowFlip : 0.1,// vertical or horizontal fliporientation:'horizontal',// ltr (left to right) or rtl (right to left)direction:'ltr',// speed for the flip transition in ms.speed:1000,// easing for the flip transition.easing:'ease-in-out',// if set to true, both the flipping page and the sides will have an overlay to simulate shadowsshadows:true,// opacity value for the "shadow" on both sides (when the flipping page is over it).// value : 0.1 - 1shadowSides:1,// opacity value for the "shadow" on the flipping page (while it is flipping).// value : 0.1 - 1shadowFlip:1,// if we should show the first item after reaching the end.circular:true,// if we want to specify a selector that triggers the next() function. example: '#bb-nav-next'.//nextEl : '',// if we want to specify a selector that triggers the prev() function.//prevEl : '',// If true it overwrites the circular option to true!autoplay:true,// time (ms) between page switch, if autoplay is true. interval:3000,// callback after the flip transition.// page is the current item's index.// isLimit is true if the current page is the last one (or the first one).//onEndFlip : function( page, isLimit ) { return false; },// callback before the flip transition.// page is the current item's index.//onBeforeFlip: function( page ) { return false; }});});

—
Reply to this email directly or view it on GitHub.