滾動上的滑動 - 關閉按鈕不令人滿意

Question

當您向下滾動一定數量時，我有從頁面底部向上滑動的內容。

單擊一個按鈕將關閉滑塊。

但是，如果您繼續向下滾動頁面，滑塊會再次出現。

如何關閉按鈕一次點擊，我該如何讓上滑消失？

下面是腳本：

$(document).ready(function(){ 
$(window).scroll(function(){ 
var h = $('#container').height(); 
var y = $(window).scrollTop(); 

     if(y > (h*.25)) { 
      $("#btmsUpContainer").slideDown("slow"); 
     } else { 
      $("#btmsUpContainer").slideUp("slow"); 
     } 
}); 

$('.close-it').bind('click', function() { 
     $("#btmsUpContainer").slideUp("slow"); 
    return false; 
}); 
}) 

這裏是CSS：

#btmsUpContainer { position: fixed; width: 170px; bottom: 29px; z-index: 7777; margin: 0; padding: 0; display: none; } 
#btmsUp { left: 0; width: 170px; margin: 0; } 
#btmsUp .close-it { position: absolute; left: 160px; top: 12px; right: 0; z-index: 7778; width: 10px; } 

這裏是頁面代碼：

<div id="btmsUpContainer"> 
<div id="btmsUp"> 

<span class="close-it"><a href="#"><img src="close-it.png" style="width: 10px; height: 10px; border: 0;"></a></span><br /> 

This is stuff that appears in the box that slides up. 

</div> 
</div> 

Answer 1

設置，當用戶關閉內容hidden變量，在滑動前檢查它：

$(document).ready(function(){ 
    var hidden = false; //Initialize the 'hidden' variable to 'false' 
    $(window).scroll(function(){ 
     if(!hidden){ //Check if the user has hidden the content 
      var h = $('#container').height(); 
      var y = $(window).scrollTop(); 
      if(y > (h*.25)) { 
       $("#btmsUpContainer").slideDown("slow"); 
      } else { 
       $("#btmsUpContainer").slideUp("slow"); 
      } 
     } 
    }); 

    $('.close-it').bind('click', function() { 
     $("#btmsUpContainer").slideUp("slow"); 
     hidden = true; //Set the 'hidden' variable to 'true' 
     return false; 
    }); 
})