Click here to Skip to main content
15,884,823 members
Please Sign up or sign in to vote.
1.00/5 (1 vote)
See more:
this is my html code for the page:
body>
<!-- menu -->






<button id="iterateEffects" class="pt-touch-button">
<!-- /triggers -->











/body>
Javascript(This is code to switch to next pages,but i need to add the code that will make my navigation part work:
var PageTransitions = (function() {

var $main = $( '#pt-main' ),
$pages = $main.children( 'div.pt-page' ),
$iterate = $( '#iterateEffects' ),
animcursor = 1,
pagesCount = $pages.length,
current = 0,
isAnimating = false,
endCurrPage = false,
endNextPage = false,
animEndEventNames = {
'WebkitAnimation' : 'webkitAnimationEnd',
'OAnimation' : 'oAnimationEnd',
'msAnimation' : 'MSAnimationEnd',
'animation' : 'animationend'
},
// animation end event name
animEndEventName = animEndEventNames[ Modernizr.prefixed( 'animation' ) ],
// support css animations
support = Modernizr.cssanimations;

function init() {

$pages.each( function() {
var $page = $( this );
$page.data( 'originalClassList', $page.attr( 'class' ) );
} );

$pages.eq( current ).addClass( 'pt-page-current' );

$( '#dl-menu' ).dlmenu( {
animationClasses : { in : 'dl-animate-in-2', out : 'dl-animate-out-2' },
onLinkClick : function( el, ev ) {
ev.preventDefault();
nextPage( el.data( 'animation' ) );
}
} );

$iterate.on( 'click', function() {
if( isAnimating ) {
return false;
}
if( animcursor > 1 ) {
animcursor = 1;
}
nextPage( animcursor );
++animcursor;
} );

}

function nextPage(options ) {
var animation = (options.animation) ? options.animation : options;

if( isAnimating ) {
return false;
}

isAnimating = true;

var $currPage = $pages.eq( current );

if(options.showPage){
if( options.showPage < pagesCount - 1 ) {
current = options.showPage;
}
else {
current = 0;
}
}
else{
if( current < pagesCount - 1 ) {
++current;
}
else {
current = 0;
}
}

var $nextPage = $pages.eq( current ).addClass( 'pt-page-current' ),
outClass = '', inClass = '';

switch( animation ) {



case 1:
outClass = 'pt-page-rotateCubeBottomOut pt-page-ontop';
inClass = 'pt-page-rotateCubeBottomIn';
break;



}


$currPage.addClass( outClass ).on( animEndEventName, function() {
$currPage.off( animEndEventName );
endCurrPage = true;
if( endNextPage ) {
onEndAnimation( $currPage, $nextPage );
}
} );

$nextPage.addClass( inClass ).on( animEndEventName, function() {
$nextPage.off( animEndEventName );
endNextPage = true;
if( endCurrPage ) {
onEndAnimation( $currPage, $nextPage );
}
} );

if( !support ) {
onEndAnimation( $currPage, $nextPage );
}

}

function onEndAnimation( $outpage, $inpage ) {
endCurrPage = false;
endNextPage = false;
resetPage( $outpage, $inpage );
isAnimating = false;
}

function resetPage( $outpage, $inpage ) {
$outpage.attr( 'class', $outpage.data( 'originalClassList' ) );
$inpage.attr( 'class', $inpage.data( 'originalClassList' ) + ' pt-page-current' );
}

init();

return {
init : init,
nextPage : nextPage,
};

})();
Posted
Comments
Sergey Alexandrovich Kryukov 29-Aug-15 1:43am    
Help with what? Sorry, this is not a question.
—SA

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900