屏幕不向下滾動使用JQuery的slideToggle（）

時，我有一個網站，存在被點擊的錨.show_hide當它出現並滑下這是偉大的，當它是頁面上的唯一內容的名爲.slidingDiv。屏幕不向下滾動使用JQuery的slideToggle（）

如果有其他內容上面這個div不向下滾動並顯示。相反，它顯示的是div，但它不在網站上，所以它確實有效，但不會推動其餘內容。

這裏的JQuery的：

<script type="text/javascript"> 

$(document).ready(function(){ 

     $(".slidingDiv").hide(); 
     $(".show_hide").show(); 

    $('.show_hide').click(function(){ 
    $(".slidingDiv").slideToggle(), 1000; 
    scrollTop: $(this).offset().top 
    }); 

}); 

</script>

非常感謝

皮特

來源

2012-12-14 Pete Naylor

[JSHint（http://jshint.com）和[jQuery的]（HTTP： //api.jquery.com/）文檔可幫助往往多... – yckart

在slideToggle功能slideToggle功能或回調後設置scrollTop被稱爲（如你所做的）結果充其量只是在跳躍行爲中。如果您正在尋找一個流暢的動畫，最好先啓動幻燈片，然後向下滾動頁面animate。這由fiddle證明。這裏是JS：

$(document).ready(function() { 
    $(".slidingDiv").hide(); 
    $(".show_hide").show(); 

    $('.show_hide').click(function() { 
    $(".slidingDiv").slideToggle(1000); 
    $('html, body').animate({ 
     scrollTop: $(".slidingDiv").offset().top + $('window').height() 
    }, 2000); 
    }); 
});

來源

2012-12-14 14:27:35

下面這個腳本中，DIV被觸發後，屏幕滾動下來，我可以滾動備份幾次嘗試後，頁面變得神經質，像它不讓我滾動。 –

這個小提琴，http：//jsfiddle.net/d5590q4u/，確認scrollTop值設置超出最大值。如果動畫是給定時間完成滾動位置更新和跳躍行爲消失。這不是一個好的解決方案，必須有更好的方法來解決這個問題。如果您需要更多幫助，我建議您提出一個新的SO問題。 –

scrollTop的前只是做一個檢查

<script type="text/javascript"> 
 

 
$(document).ready(function(){ 
 

 
\t $(".slidingDiv").hide(); 
 
\t $(".show_hide").show(); 
 

 
\t $('.show_hide').on('click',function(){ 
 
\t \t $(".slidingDiv").slideToggle(function(){ 
 
\t \t \t if($('.slidingDiv').height() > 0) { 
 
\t \t \t \t $('html, body').animate({ 
 
\t \t \t   scrollTop: $(".slidingDiv").offset().top 
 
\t \t \t  }, 1000); 
 
\t \t \t } 
 
\t \t }); 
 
\t }); 
 

 
}); 
 

 
</script>

來源

2015-04-15 07:08:42 user3119274

屏幕不向下滾動使用JQuery的slideToggle（）

回答

相關問題