5

私は自分のウェブサイトで一番上にスクロールするボタンを使用しています。このJqueryを使用しています

    $(window).scroll(function() {
    if ($(this).scrollTop()) {
        $('#cttm:hidden').stop(true, true).fadeIn();
    } else {
        $('#cttm').stop(true, true).fadeOut();
    }
});


  $(document).ready(function(){
      var bottom = ($(window).outerHeight() - $(window).height()) - 150; // 150 pixel to the bottom of the page; 
      $(window).scroll(function(){
          if ($(window).scrollTop() >= bottom ) {
                  $("#cttm").fadeTo("slow",.95);
             } else {
                  $("#cttm").fadeOut("slow");
             }
      });

      $("#cttm").click(function(){
          $('html, body').animate({scrollTop:0}, 'slow');
          $("#cttm").fadeOut("slow");
      });
  });

この Jquery はうまく機能しますが、上から 200px までスクロールしたときにのみ要素が表示されるようにしたいです。JQuery でそれを行う方法はありますか?

4

1 に答える 1

7

そのためにウィンドウの高さは必要ありません。

var isVisible = false;
$(window).scroll(function(){
     var shouldBeVisible = $(window).scrollTop()>200;
     if (shouldBeVisible && !isVisible) {
          isVisible = true;
          $('#mybutton').show();
     } else if (isVisible && !shouldBeVisible) {
          isVisible = false;
          $('#mybutton').hide();
    }
});

デモンストレーション: http://jsfiddle.net/dystroy/gXSLE/

于 2012-07-05T08:53:13.253 に答える