Element.scrollIntoView()

直接上例子代碼給大家一點參考:

<html>
  <style>
    span {
      display: block;
      height: 150%;
    } /*整點上下的空白 */
  </style>
  <body>
    <button id="from">點擊我</button>
    <span></span>
    <div id="to">滾動到這:頭條@plzbefat</div>
    <span></span>
  </body>
  <script>
    document.getElementById("from").addEventListener("click", () => {
      document.getElementById("to").scrollIntoView({
        behavior: "smooth", //順滑的滾動
      });
    });
  </script>
</html>

JavaScript-如何實現滾動頁面到指定位置？

整點例子沒毛病

語法

element.scrollIntoView(); // 等同于element.scrollIntoView(true) 滾動 元素在頂部
element.scrollIntoView(false); // 滾動 元素在底部
element.scrollIntoView(option); //參數

參數

alignToTop:

如果為true，元素的頂端將和其所在滾動區的可視區域的頂端對齊。相應的 scrollIntoViewOptions: {block: “start”, inline: “nearest”}。這是這個參數的默認值。

如果為false，元素的底端將和其所在滾動區的可視區域的底端對齊。相應的scrollIntoViewOptions: {block: “end”, inline: “nearest”}。

scrollIntoViewOptions:

behavior 可選

定義動畫過渡效果， “auto”或 “smooth” 之一。默認為 “auto”。

block 可選

定義垂直方向的對齊， “start”, “center”, “end”, 或 “nearest”之一。默認為 “start”。

inline 可選

定義水平方向的對齊， “start”, “center”, “end”, 或 “nearest”之一。默認為 “nearest”。

點擊展開全文

js移動端滑動事件（js實現左右滑動頁面效果）

Element.scrollIntoView()

語法

參數

發表評論

js移動端滑動事件（js實現左右滑動頁面效果）

Element.scrollIntoView()

語法

參數

相關推薦

關于劫持：JS劫持手法

飛利浦276e顯示器評測（飛利浦276e8VJSB怎么樣）

js壓縮工具哪些好（推薦這15款壓縮工具）

js壓縮工具哪個好（實測好用且簡單的9款工具）

js日期加一天的公式（js獲取下一天的日期的方法）

jsp和servlet區別在哪（簡述2者間的不同處）

發表評論