將頁面滾動到顯示塊的顯示位置

Question

我在頁面中間有一個元素，使用display.none。當我更改顯示屏以阻止頁面滾動到該位置時，我想要。那可能嗎？

Answer 1

假設您使用JavaScript在某些時候將該元素從「display：none」更改爲「display：block」，您可以使用一些javascript同時滾動到該元素。

編輯：我只是建立了這個真正的快速，它絕對有效。

說明：atSomePoint只是觸發display：none到display：block的任何事件。我正在使用.show（），以便從隱藏的元素在這裏阻止，但顯然有各種方式可以做到這一點。滾動部分進入下一個。我們正在瀏覽頁面的主體併爲其製作動畫;去哪兒？那麼，元素的位置。所以我們使用'scrollTop'來設置動畫，使用'.offset（）。top'設置$（el）從頂部開始。 500就是動畫需要多長時間，'擺動'是動畫類型（緩動），甚至沒有必要。另外，如果你對stop（）好奇，那隻會停止正在執行的其他當前動畫。它仍然適用於這個遺漏。

(function() { 
    $(el).atSomePoint, function() { 
    $(this).show(); 
    $('html, body').stop().animate({ 
     'scrollTop': $(el).offset().top 
    }, 500, 'swing'); 
    }); 
}); 

Answer 2

你可以嘗試使用ScrollTo方法 - MDN ScrollTo

window.scrollTo(500,0); // (500,0) are the co-ordinates for the ScrollTo method 

，或者你可以嘗試jQuery的ScrollTop

$("div.demo").scrollTop(300); 

Answer 3

scrollTop的方法嘗試window.scrollTo(x-coord,y-coord)

x-coord is the pixel along the horizontal axis of the document that you want displayed in the upper left. 

y-coord is the pixel along the vertical axis of the document that you want displayed in the upper left. 

https://developer.mozilla.org/en-US/docs/Web/API/Window.scrollTo