asandikci.com/web
1
0
Fork 0
Code Issues 5 Pull requests Projects Releases Packages Wiki Activity Actions

Add fade in effect for lazy-loaded images

Browse source
This commit is contained in:
Cotes Chung 2021-07-11 14:36:46 +08:00
parent 961ebb545b
commit bea170cff0
1 changed files with 9 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
_sass/addon/commons.scss
View file

@ -375,9 +375,18 @@ footer {
} }
} }
@keyframes fade-in {
from { opacity: 0; }
to { opacity: 1; }
}
img[data-src] { img[data-src] {
margin: 0.5rem 0; margin: 0.5rem 0;
&[data-loaded=true] {
animation: fade-in linear .5s;
}
&.left { &.left {
float: left; float: left;
margin: 0.75rem 1rem 1rem 0; margin: 0.75rem 1rem 1rem 0;