2016-06-08 44 views
1

我使用可見行的最後一行根據網格中的行數滾動瀏覽網格多次。如何使用量角器將滾動重置到網格頂部

如何將滾動重置到網格頂部?我是否需要多次執行以達到網格的頂部,或者是否有簡單的方法來重置滾動?

我試着用(0,0)座標,但它沒有奏效。

HTML之前滾動

<div class="ag-body" style="padding-top: 25px; padding-bottom: 30px;"> 
 
<div class="ag-pinned-left-cols-viewport" style="display: inline; height: 552px;"> 
 
<div class="ag-pinned-right-cols-viewport" style="display: none; height: 552px;"> 
 
<div class="ag-body-viewport-wrapper" style="margin-left: 480px; margin-right: 0px;"> 
 
<div class="ag-body-viewport" style="overflow-y: auto;"> 
 
<div class="ag-body-container" style="width: 1415px; height: 1830px;"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-117 ag-row-index-16" style=" top: 480px; height: 30px;" row-id="117" row="16" v_element_id="374"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-118 ag-row-index-17" style=" top: 510px; height: 30px;" row-id="118" row="17" v_element_id="391"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-119 ag-row-index-18" style=" top: 540px; height: 30px;" row-id="119" row="18" v_element_id="408"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-120 ag-row-index-19" style=" top: 570px; height: 30px;" row-id="120" row="19" v_element_id="425"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-121 ag-row-index-20" style=" top: 600px; height: 30px;" row-id="121" row="20" v_element_id="442"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-116 ag-row-index-15" style=" top: 450px; height: 30px;" row-id="116" row="15" v_element_id="1968"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-115 ag-row-index-14" style=" top: 420px; height: 30px;" row-id="115" row="14" v_element_id="2070"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-114 ag-row-index-13" style=" top: 390px; height: 30px;" row-id="114" row="13" v_element_id="2087"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-113 ag-row-index-12" style=" top: 360px; height: 30px;" row-id="113" row="12" v_element_id="2104"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-112 ag-row-index-11" style=" top: 330px; height: 30px;" row-id="112" row="11" v_element_id="2121"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-111 ag-row-index-10" style=" top: 300px; height: 30px;" row-id="111" row="10" v_element_id="2138"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-110 ag-row-index-9" style=" top: 270px; height: 30px;" row-id="110" row="9" v_element_id="2155"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-109 ag-row-index-8" style=" top: 240px; height: 30px;" row-id="109" row="8" v_element_id="2172"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-108 ag-row-index-7" style=" top: 210px; height: 30px;" row-id="108" row="7" v_element_id="2189"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-106 ag-row-index-5" style=" top: 150px; height: 30px;" row-id="106" row="5" v_element_id="2206"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-107 ag-row-index-6" style=" top: 180px; height: 30px;" row-id="107" row="6" v_element_id="2223"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-105 ag-row-index-4" style=" top: 120px; height: 30px;" row-id="105" row="4" v_element_id="2240"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-104 ag-row-index-3" style=" top: 90px; height: 30px;" row-id="104" row="3" v_element_id="2257"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-103 ag-row-index-2" style=" top: 60px; height: 30px;" row-id="103" row="2" v_element_id="2274"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-102 ag-row-index-1" style=" top: 30px; height: 30px;" row-id="102" row="1" v_element_id="2291"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-101 ag-row-index-0" style=" top: 0px; height: 30px;" row-id="101" row="0" v_element_id="2308"> 
 
</div> 
 
</div> 
 
</div>

HTML滾動

<div class="ag-body" style="padding-top: 25px; padding-bottom: 30px;"> 
 
<div class="ag-pinned-left-cols-viewport" style="display: inline; height: 552px;"> 
 
<div class="ag-pinned-right-cols-viewport" style="display: none; height: 552px;"> 
 
<div class="ag-body-viewport-wrapper" style="margin-left: 480px; margin-right: 0px;"> 
 
<div class="ag-body-viewport" style="overflow-y: auto;"> 
 
<div class="ag-body-container" style="width: 1415px; height: 1830px;"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-117 ag-row-index-16" style=" top: 480px; height: 30px;" row-id="117" row="16" v_element_id="374"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-118 ag-row-index-17" style=" top: 510px; height: 30px;" row-id="118" row="17" v_element_id="391"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-119 ag-row-index-18" style=" top: 540px; height: 30px;" row-id="119" row="18" v_element_id="408"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-120 ag-row-index-19" style=" top: 570px; height: 30px;" row-id="120" row="19" v_element_id="425"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-121 ag-row-index-20" style=" top: 600px; height: 30px;" row-id="121" row="20" v_element_id="442"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-122 ag-row-index-21" style=" top: 630px; height: 30px;" row-id="122" row="21" v_element_id="1611"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-123 ag-row-index-22" style=" top: 660px; height: 30px;" row-id="123" row="22" v_element_id="1662"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-124 ag-row-index-23" style=" top: 690px; height: 30px;" row-id="124" row="23" v_element_id="1679"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-125 ag-row-index-24" style=" top: 720px; height: 30px;" row-id="125" row="24" v_element_id="1696"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-126 ag-row-index-25" style=" top: 750px; height: 30px;" row-id="126" row="25" v_element_id="1713"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-127 ag-row-index-26" style=" top: 780px; height: 30px;" row-id="127" row="26" v_element_id="1730"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-128 ag-row-index-27" style=" top: 810px; height: 30px;" row-id="128" row="27" v_element_id="1747"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-129 ag-row-index-28" style=" top: 840px; height: 30px;" row-id="129" row="28" v_element_id="1764"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-130 ag-row-index-29" style=" top: 870px; height: 30px;" row-id="130" row="29" v_element_id="1781"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-131 ag-row-index-30" style=" top: 900px; height: 30px;" row-id="131" row="30" v_element_id="1798"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-132 ag-row-index-31" style=" top: 930px; height: 30px;" row-id="132" row="31" v_element_id="1815"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-133 ag-row-index-32" style=" top: 960px; height: 30px;" row-id="133" row="32" v_element_id="1832"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-134 ag-row-index-33" style=" top: 990px; height: 30px;" row-id="134" row="33" v_element_id="1849"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-135 ag-row-index-34" style=" top: 1020px; height: 30px;" row-id="135" row="34" v_element_id="1866"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-136 ag-row-index-35" style=" top: 1050px; height: 30px;" row-id="136" row="35" v_element_id="1883"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-116 ag-row-index-15" style=" top: 450px; height: 30px;" row-id="116" row="15" v_element_id="1968"> 
 
<div class="ag-row ag-row-no-focus ag-row-even ag-row-level-0 ag-row-id-137 ag-row-index-36" style=" top: 1080px; height: 30px;" row-id="137" row="36" v_element_id="2036"> 
 
<div class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-id-202 ag-row-index-37" style=" top: 1110px; height: 30px;" row-id="202" row="37" v_element_id="2053"> 
 
</div> 
 
</div> 
 
</div>

回答

0

後,你會想這樣做VAR element.scrol lTop = 0;其中元素是你的容器,其中滾動有

+0

除了沒有'var'。其實,我不確定它有什麼不同。 –

0

你可以做一個向上滾動使用,

jse.executeScript("window.scrollBy(0,-250)", ""); 

OR

jse.executeScript("scroll(0, -250);"); 

希望這有助於。 :)

1

您可以在可滾動容器上調用.scrollTo(0, 0)。它似乎是您的HTML中的.ag-body-viewport

browser.executeScript("document.querySelector('.ag-body-viewport').scrollTo(0, 0);");