jqueryで上下スクロール効果を実装するサンプルコード_javascriptスキル-jsチュートリアル-php.cn

コードをコピーします コードは次のとおりです: $(function() { var page = 1; var i = 1; var conheight = $('.con li').height(); var lilen = $('li').length; Math.ceil ( lilen / i ); alert(conheight " " len);//alert("page:" ページ " i:" i " conheight:" conheight " lilen:" lilen " len: " len) $('.next').click(function() { if( page == len){ alert("操作できなくなりました!"); return false ; } $('.con_list').animate({top:'-=' conheight},'slow'); ページ ; //if( ページ == len ) { // $('.con_list').animate({top:0},'slow'); // ページ = 1 // }else{ // $ ( '.con_list').animate({top:'-=' conheight},'slow'); //} }); prev ').click(function() { if(page == 1){ alert("これで終わりで、これ以上の操作は実行できません!"); return false; } $ ('.con_list').animate({top:' =' conheight},'slow'); page--; //if( page == 1 ) { // $( '.con_list').animate({top:'-=' conheight*(len - 1)},'slow'); // ページ = //} else{ / / $('.con_list').animate({top:' =' conheight},'slow'); // page--; ); } ) margin:0;padding:0 } .prev,. next{ width:100px;height:20px;background:#333;cursor:pointer } .con{ width:100px;height:300px;overflow: hidden;position:relative } .con_list{ position:relative } .con li{ height:100px } .one{ background:#F90 } .two { background:#69C } .three{ background:#633 } > &lt 11111111111111111111 22222222222222222222 "3" >3333333333333333333 44444444444444 55555555555555 lt;/li> 666666666666666666 7777777777777777 8888888 8888 888888888 9999999999 ;/div>