我有一个页面过渡动画，我想做一个在Pt-Pages之间切换的导航。请帮助我将此代码添加到我的Javascript.Thanks

本文介绍了我有一个页面过渡动画，我想做一个在Pt-Pages之间切换的导航。请帮助我将此代码添加到我的Javascript.Thanks的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述 这是我的页面的html代码： body> <！ - 菜单 - > 主页 关于 工作 联络 this is my html code for the page:body> <!-- menu --> Home About Work Contact < button id =iterateEffectsclass =pt-touch-button> <button id="iterateEffects" class="pt-touch-button"><！ - /触发器 - > <!-- /triggers --> / body> Javascript（这是切换到下一页的代码，但我需要添加将使我的导航的代码部分工作： 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'， '动画'：'animationend' }， //动画结束事件名称 animEndEventName = animEndEventNames [Modernizr.prefixed（'animation'）]， //支持css动画 support = Modernizr.cssanimations; 函数init（）{ $ pages.ea ch（function（）{ var $ page = $（this）; $ page.data（'originalClassList'，$ page.attr（'class'）） ; }）; $ pages.eq（当前）.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; }）; } 函数nextPage（options）{ var animation =（options.animation）？ options.animation：options; if（isAnimating）{ 返回false; } isAnimating = true; var $ currPage = $ pages.eq（当前）; 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（当前）.addClass（'pt-page-current'）， outClass =''，inClass =''; 开关（动画）{ 案例1： outClass ='pt-page-rotateCubeBottomOut pt-page-ontop'; inClass ='pt-page-rotateCubeBottomIn'; 休息; } $ currPage.addClass（outClass）.on（animEndEventName，function（）{ $ currPage.off（animEndEventName）; endCurrPage = true; if（endNextPage）{ onEndAnimation（ $ currPage，$ nextPage）; } }）; $ nextPage.addClass（inClass） .on（animEndEventName，function（）} endNextPage = true; if（endCurrPage）{ onEndAnimation（$ currPage，$ nextPage）; } }）; if（！support）{ onEndAnimation（$ currPage，$ nextPage）; } } 函数onEndAnimation（$ outpage，$ inpage）{ endCurrPage = false; end NextPage = false; resetPage（$ outpage，$ inpage）; isAnimating = false; } 函数resetPage（$ outpage，$ inpage）{ $ outpage.attr（'class'，$ outpage.data（'originalClassList'））; $ inpage.attr（'class'，$ inpage.data（'originalClassList'）+'pt-page-current'）; } init（）; 返回{ init：init， nextPage ：nextPage， }; }）（）; /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 nameanimEndEventName = animEndEventNames[ Modernizr.prefixed( 'animation' ) ],// support css animationssupport = 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,};})(); 推荐答案 main = （'＃pt-main'）， ( '#pt-main' ), pages = 这篇关于我有一个页面过渡动画，我想做一个在Pt-Pages之间切换的导航。请帮助我将此代码添加到我的Javascript.Thanks的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！