我有一个.js文档,它允许我在不同的页面之间切换到同一个html文档中。我有一个触发按钮,只在点击时激活转换,我也想在滚动时或只在滚动时激活它。我试图在函数中添加一个onscroll参数,但没有成功。我想这是因为我有不同的页面宽度:100%,所以我没有任何滚动条。。。
这是我的HTML结构
<body>
<button id="iterateEffects" class="btn_bot"></button> <!--Trigger btn-->
<div id="pt-main" class="pt-perspective">
<div class="pt-page pt-page-1">First page code inside</div>
<div class="pt-page pt-page-2">Second page code inside</div>
etc...
</div>
</body>
这是我的按钮功能
$iterate = $( '#iterateEffects' ) //my iterateEffects var
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() {
animcursor = 3;
nextPage( animcursor );
} ); //Activate the function on click
}
你试过这个吗:
$( document ).on( 'scroll', function() {
animcursor = 3;
nextPage( animcursor );
} );
还要确保您的页面是可滚动的。