here is what I have it works in Fire Fox and chrome not in IE7.

<code>
   window.addEvent('domready', function() {
        /* things in here happen as soon the document is ready */

        // set constants
        var $pageheight = 189; // the single page height we're using
        var $pagewidth = 146; // the single page width we're using
        var $pageYpos = 0; // the current Y position of our  background-image
(in both pages)
        var $turnheight = 0; // The height of the page turning image.
        var $turnwidth = 0; // The width of the page turning image.
        var $bgposition = 0;

        var leftpage = $('leftpage');
        var rightpage = $('rightpage');
        var flip = $('flip');
        var lfx = leftpage.effects({duration: 10, transition:
Fx.Transitions.Quart.easeOut});
        var rfx = rightpage.effects({duration: 10, transition:
Fx.Transitions.Quart.easeOut});
        var flipfx = flip.effects({duration: 50, transition:
Fx.Transitions.Quart.easeOut});

        //Start Leftpage
                $('leftpage').addEvent('mousedown', function() {
                        $pageYpos = $pageYpos + $pageheight;
                        $bgposition = '0px '+$pageYpos+'px';
                        lfx.start({'background-position': $bgposition});
                        flipfx.start({'background-position': '0 0'});
                });

                $('leftpage').addEvent('click', function() {
                        $bgposition = '146px '+$pageYpos+'px';
                        flipfx.start({'background-position': '236px 0px'});
                        rfx.start({'background-position': $bgposition});
                });
        //End Leftpage
        //Start Rightpage
                $('rightpage').addEvent('mousedown', function() {
                        $pageYpos = $pageYpos + $pageheight;
                        $bgposition = '146px '+$pageYpos+'px';
                        rfx.start({'background-position': $bgposition});
                        flipfx.start({'background-position': '118px 0px'});
                });

                $('rightpage').addEvent('click', function() {
                        $bgposition = '0px '+$pageYpos+'px';
                        flipfx.start({'background-position': '236px 0px'});
                        lfx.start({'background-position': $bgposition});
                });
        //End Rightpage

});
</code>

Reply via email to