質問編集履歴

2

タイトル編集

2022/08/11 08:12

投稿

webkkmm
webkkmm

スコア1

test CHANGED
@@ -1 +1 @@
1
- スナップスクロール内フェードインさ、下からスクロール時にもフェードインできるようにさせる方法
1
+ スナップスクロール内フェードインを実行したいに、下からスクロールした時にもフェードインできるようにさせたいです。
test CHANGED
File without changes

1

コードの追加

2022/08/11 08:04

投稿

webkkmm
webkkmm

スコア1

test CHANGED
File without changes
test CHANGED
@@ -8,7 +8,7 @@
8
8
  ```html
9
9
  <main class="container">
10
10
  <section class="scroll-snap"> </section>
11
- <section class="scroll-snap">
11
+ <section class="scroll-snap position">
12
12
  <div class="text"> //この部分をフェードイン
13
13
  <p>テキスト</p>
14
14
  </div>
@@ -26,6 +26,19 @@
26
26
  .scroll-snap{
27
27
  height: 100%;
28
28
  scroll-snap-align: start;
29
+ }
30
+
31
+ .position{
32
+ position:relative;
33
+ }
34
+
35
+ .text{
36
+ position: absolute;
37
+ top: 50%;
38
+ left: 50%;
39
+ transform: translate(-50%, -50%);
40
+ width:200px;
41
+ height:200px;
29
42
  }
30
43
  ```
31
44
  ```js