teratail header banner
teratail header banner
質問するログイン新規登録

回答編集履歴

4

追記しました。

2020/04/06 11:22

投稿

new1ro
new1ro

スコア4528

answer CHANGED
@@ -23,6 +23,7 @@
23
23
  ```JS
24
24
  var element = document.getElementById("last");
25
25
  element.scrollIntoView(false);
26
+ window.scrollTo(0, 0); /* 画面全体のスクロール位置を最上部に */
26
27
  ```
27
28
  まずは上記のように末尾の要素にidを振り、getElementByIdで要素を取得し動くかどうかを確認してください。
28
29
 

3

追記しました。

2020/04/06 11:22

投稿

new1ro
new1ro

スコア4528

answer CHANGED
@@ -7,4 +7,24 @@
7
7
  box-sizing: border-box;
8
8
  overflow-y: auto; /* 必要なときだけ縦方向のスクロールバーを表示 */
9
9
  }
10
- ```
10
+ ```
11
+
12
+ ----
13
+ 追記しました。
14
+
15
+ ```HTML
16
+ <div class="parent">
17
+ <div class="box"></div>
18
+ <div class="box"></div>
19
+ <div class="box"></div>
20
+ <div class="box" id="last"></div>
21
+ </div>
22
+ ```
23
+ ```JS
24
+ var element = document.getElementById("last");
25
+ element.scrollIntoView(false);
26
+ ```
27
+ まずは上記のように末尾の要素にidを振り、getElementByIdで要素を取得し動くかどうかを確認してください。
28
+
29
+ 参考URL:
30
+ [https://qiita.com/amamamaou/items/728d571d508347b2bc82](https://qiita.com/amamamaou/items/728d571d508347b2bc82)

2

修正

2020/04/06 11:00

投稿

new1ro
new1ro

スコア4528

answer CHANGED
@@ -1,7 +1,7 @@
1
1
  左側の要素の中身が仮に300pxだとして、以下のようにするとスクロールするようにすることはできます。
2
2
 
3
3
  ```CSS
4
- .左要素 {
4
+ .左ボックス {
5
5
  padding: 10px;
6
6
  height: 280px; /* 中身のサイズより小さい値を指定 */
7
7
  box-sizing: border-box;

1

修正

2020/04/06 10:39

投稿

new1ro
new1ro

スコア4528

answer CHANGED
@@ -5,6 +5,6 @@
5
5
  padding: 10px;
6
6
  height: 280px; /* 中身のサイズより小さい値を指定 */
7
7
  box-sizing: border-box;
8
- overflow-y: auto;
8
+ overflow-y: auto; /* 必要なときだけ縦方向のスクロールバーを表示 */
9
9
  }
10
10
  ```