jQuery滾動li id頂部div

我正在使用JQuery將選定的列表項滾動到div中的溢出設置爲視圖。下面的代碼工作正常，但它將選定的列表項目滾動到屏幕的頂部，而不是#QuestionScroller div的頂部。這使得它在上面的內容中不可見。我添加了75px偏移量，但這並不理想，因爲上述內容的高度可能因視口大小而異。那麼如何讓腳本適應滾動到頂部#QuestionScroller div不是頁面頂部？jQuery滾動li id頂部div

$(window).load(function() { 
    var contactTopPosition = $("#ListItemQuestion<%=Session["QuestionID"] %>").position().top - 75; 
    $("#QuestionScroller").animate({ scrollTop: contactTopPosition },2500); 
});

來源

2015-12-03 IainB

請參閱下面的代碼。希望這會對你有所幫助。

var container = $('#QuestionScroller'), 
 
    scrollTo = $('#ListItemQuestion'); 
 
    container.animate({scrollTop: scrollTo.offset().top - container.offset().top + 
 
         container.scrollTop()});

#QuestionScroller { 
 
    width: 200px; 
 
    height: 70px; 
 
    border: 1px solid blue; 
 
    overflow: auto; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="QuestionScroller"> 
 
    <ul> 
 
     <li id='row_1'>111111</li> 
 
     <li id='row_2'>222222</li> 
 
     <li id='row_3'>333333</li> 
 
     <li id='ListItemQuestion'>444444</li> 
 
     <li id='row_5'>555555</li> 
 
     <li id='row_6'>666666</li> 
 
     <li id='row_7'>777777</li> 
 
     <li id='row_8'>888888</li> 
 
     <li id='row_9'>999999</li> 
 
    </ul> 
 
</div>

來源

2015-12-03 18:42:33 Azim

你可以這樣做
$("body").animate({scrollTop:$(「##QuestionScroller」).offset().top},2500)
它可以工作？

來源

2015-12-03 14:24:29 yaochiqkl

我認爲，這將滾動DIV #QuestionScroller頂端，但我需要的列表項ID #ListItemQuestion滾動到div #QuestionScroller的頂部。上面我的OP中的代碼很好地將列表項目滾動到頁面頂部-75，但我需要滾動到div #QuestionScroller的頂部。 – IainB

jQuery滾動li id頂部div

回答

相關問題