2

2つのボタンが正常に機能するスクロールテキストを取得しましたが、停止できないようです。マージン<0の場合とifステートメントでボタンを無効にしようとしています。

こちらのデモをご覧ください。

http://jsbin.com/udumos/2/edit

コード：

$(function() {

    var margin = parseInt(jQuery('#content').css('margin-top'), 10);

    $('#scroll-down').click(function() {

        $('#content').animate({
            'margin-top': '+=50'
        }, 1000);

        return margin;

    });

    if (margin > 0) {
        $('#scroll-up').click(function() {

            $('#content').animate({
                'margin-top': '-=50'
            }, 1000);

        });
    }

});
4

2 に答える 2

2

クリックイベントごとにマージンを更新する必要があります。

$(function () {
    $('#scroll-down').click(function () {
        $('#content').animate({
            'margin-top': '+=50'
        }, 1000);
        return margin;
    });

    $('#scroll-up').click(function () {
        var margin = parseInt(jQuery('#content').css('margin-top'), 10);
        if (margin >= 0) {
            $('#content').animate({
                'margin-top': '-=50'
            }, 1000);
        }
    });
});
于 2013-01-04T20:10:11.970 に答える
1

クリック内でそのifステートメントを移動する必要があります。また、クリックするたびにマージンを更新する必要があります。また、下のクリックの周りにifステートメントを配置して、上にいる場合に下に移動できないようにします。

更新されたjsbin

jQuery

$(function(){

   var margin = parseInt(jQuery('#content').css('margin-top'), 10);

   $('#scroll-down').click(function(){
       if( margin > 0 ) {
           // Update margin
           margin -= 50;
           $('#content').animate({
              'margin-top': '+=50'
           }, 1000);
       }
   });


   $('#scroll-up').click(function(){
       // Update margin
       margin += 50;
       $('#content').animate({
          'margin-top': '-=50'
       }, 1000);
   });
});
于 2013-01-04T20:16:45.340 に答える