質問編集履歴
2
CSS追記
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -68,5 +68,20 @@
|
|
|
68
68
|
background-size:auto 70%;
|
|
69
69
|
}
|
|
70
70
|
}
|
|
71
|
+
|
|
72
|
+
.fadeIn {
|
|
73
|
+
animation-name: fadeIn;
|
|
74
|
+
animation-fill-mode: both;
|
|
75
|
+
animation-duration: 1s;
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
@keyframes fadeIn {
|
|
71
|
-
|
|
79
|
+
0% {
|
|
80
|
+
opacity: 0;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
100% {
|
|
84
|
+
opacity: 1;
|
|
85
|
+
}
|
|
86
|
+
}
|
|
72
87
|
```
|
1
HTML追記
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -1,13 +1,12 @@
|
|
|
1
1
|
fadInアニメーションを更新時に読みこむようにしたいのですが、マウスオーバー時にもかかってしまって困っています。
|
|
2
2
|
|
|
3
|
-
```<li class="works fadeIn">
|
|
4
|
-
<a href="#">
|
|
5
|
-
<span >
|
|
6
|
-
Works
|
|
7
|
-
</span>
|
|
8
|
-
</a>
|
|
9
|
-
</li>
|
|
10
3
|
```
|
|
4
|
+
<li class="works fadeIn">
|
|
5
|
+
<a href="#">
|
|
6
|
+
<span>works</span>
|
|
7
|
+
</a>
|
|
8
|
+
</li>
|
|
9
|
+
```
|
|
11
10
|
|
|
12
11
|
```
|
|
13
12
|
.works {
|