Skip to content

Commit 42dcb22

Browse files
committed
add inline styles, initial hide with low opacity
1 parent f89abd5 commit 42dcb22

File tree

8 files changed

+478
-496
lines changed

8 files changed

+478
-496
lines changed

README.md

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -223,7 +223,6 @@ myEnami.addEventListener('enami:animate-out', function (e) {
223223
```css
224224
[data-enami="my-animation"][data-enami-in] {
225225
animation: 2s fadeUp forwards cubic-bezier(0.19, 1, 0.22, 1);
226-
visibility: visible;
227226
@keyframes myAnimation {
228227
from {
229228
transform: translate3d(0, 40px, 0) rotate(0.02deg);

dist/enami.css

Lines changed: 4 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,6 @@
2929
to {
3030
transform: translate3d(0, 0, 0) rotate(0deg);
3131
opacity: 1;
32-
visibility: visible;
3332
}
3433
}
3534

@@ -41,7 +40,6 @@
4140
to {
4241
transform: translate3d(0, 0, 0) rotate(0deg);
4342
opacity: 1;
44-
visibility: visible;
4543
}
4644
}
4745

@@ -60,7 +58,6 @@
6058
to {
6159
transform: translate3d(0, 0, 0) rotate(0deg);
6260
opacity: 1;
63-
visibility: visible;
6461
}
6562
}
6663

@@ -72,7 +69,6 @@
7269
to {
7370
transform: translate3d(0, 0, 0) rotate(0deg);
7471
opacity: 1;
75-
visibility: visible;
7672
}
7773
}
7874

@@ -91,7 +87,6 @@
9187
to {
9288
transform: translate3d(0, 0, 0) rotate(0deg);
9389
opacity: 1;
94-
visibility: visible;
9590
}
9691
}
9792

@@ -103,7 +98,6 @@
10398
to {
10499
transform: translate3d(0, 0, 0) rotate(0deg);
105100
opacity: 1;
106-
visibility: visible;
107101
}
108102
}
109103

@@ -122,7 +116,6 @@
122116
to {
123117
transform: translate3d(0, 0, 0) rotate(0deg);
124118
opacity: 1;
125-
visibility: visible;
126119
}
127120
}
128121

@@ -134,7 +127,6 @@
134127
to {
135128
transform: translate3d(0, 0, 0) rotate(0deg);
136129
opacity: 1;
137-
visibility: visible;
138130
}
139131
}
140132

@@ -151,7 +143,6 @@
151143
}
152144
to {
153145
opacity: 1;
154-
visibility: visible;
155146
}
156147
}
157148

@@ -161,7 +152,6 @@
161152
}
162153
to {
163154
opacity: 1;
164-
visibility: visible;
165155
}
166156
}
167157

@@ -210,7 +200,6 @@
210200
to {
211201
transform: scale(1) rotate(0deg) rotate(0deg);
212202
opacity: 1;
213-
visibility: visible;
214203
}
215204
}
216205

@@ -222,7 +211,6 @@
222211
to {
223212
transform: scale(1) rotate(0deg) rotate(0deg);
224213
opacity: 1;
225-
visibility: visible;
226214
}
227215
}
228216

@@ -241,7 +229,6 @@
241229
to {
242230
transform: translate3d(0, 0, 0) rotate(0deg) rotate(0deg);
243231
opacity: 1;
244-
visibility: visible;
245232
}
246233
}
247234

@@ -253,7 +240,6 @@
253240
to {
254241
transform: translate3d(0, 0, 0) rotate(0deg) rotate(0deg);
255242
opacity: 1;
256-
visibility: visible;
257243
}
258244
}
259245

@@ -272,7 +258,6 @@
272258
to {
273259
transform: translate3d(0, 0, 0) rotate(0deg) rotate(0deg);
274260
opacity: 1;
275-
visibility: visible;
276261
}
277262
}
278263

@@ -284,7 +269,6 @@
284269
to {
285270
transform: translate3d(0, 0, 0) rotate(0deg) rotate(0deg);
286271
opacity: 1;
287-
visibility: visible;
288272
}
289273
}
290274

@@ -303,7 +287,6 @@
303287
to {
304288
transform: translate3d(0, 0, 0) rotate(0deg) rotate(0deg);
305289
opacity: 1;
306-
visibility: visible;
307290
}
308291
}
309292

@@ -315,7 +298,6 @@
315298
to {
316299
transform: translate3d(0, 0, 0) rotate(0deg) rotate(0deg);
317300
opacity: 1;
318-
visibility: visible;
319301
}
320302
}
321303

@@ -334,7 +316,6 @@
334316
to {
335317
transform: translate3d(0, 0, 0) rotate(0deg) rotate(0deg);
336318
opacity: 1;
337-
visibility: visible;
338319
}
339320
}
340321

@@ -346,7 +327,6 @@
346327
to {
347328
transform: translate3d(0, 0, 0) rotate(0deg) rotate(0deg);
348329
opacity: 1;
349-
visibility: visible;
350330
}
351331
}
352332

@@ -407,7 +387,6 @@
407387
to {
408388
transform: scale(1) rotate(0deg);
409389
opacity: 1;
410-
visibility: visible;
411390
}
412391
}
413392

@@ -419,7 +398,6 @@
419398
to {
420399
transform: scale(1) rotate(0deg);
421400
opacity: 1;
422-
visibility: visible;
423401
}
424402
}
425403

@@ -438,7 +416,6 @@
438416
to {
439417
transform: scale(1) rotate(0deg);
440418
opacity: 1;
441-
visibility: visible;
442419
}
443420
}
444421

@@ -450,7 +427,6 @@
450427
to {
451428
transform: scale(1) rotate(0deg);
452429
opacity: 1;
453-
visibility: visible;
454430
}
455431
}
456432

@@ -469,7 +445,6 @@
469445
to {
470446
transform: scale(1) rotate(0deg);
471447
opacity: 1;
472-
visibility: visible;
473448
}
474449
}
475450

@@ -481,7 +456,6 @@
481456
to {
482457
transform: scale(1) rotate(0deg);
483458
opacity: 1;
484-
visibility: visible;
485459
}
486460
}
487461

@@ -500,7 +474,6 @@
500474
to {
501475
transform: scale(1) rotate(0deg);
502476
opacity: 1;
503-
visibility: visible;
504477
}
505478
}
506479

@@ -512,7 +485,6 @@
512485
to {
513486
transform: scale(1) rotate(0deg);
514487
opacity: 1;
515-
visibility: visible;
516488
}
517489
}
518490

@@ -531,7 +503,6 @@
531503
to {
532504
transform: scale(1) rotate(0deg);
533505
opacity: 1;
534-
visibility: visible;
535506
}
536507
}
537508

@@ -543,7 +514,6 @@
543514
to {
544515
transform: scale(1) rotate(0deg);
545516
opacity: 1;
546-
visibility: visible;
547517
}
548518
}
549519

@@ -600,7 +570,7 @@
600570
}
601571
to {
602572
transform: scale(1);
603-
visibility: visible;
573+
opacity: 1;
604574
}
605575
}
606576

@@ -610,7 +580,7 @@
610580
}
611581
to {
612582
transform: scale(1);
613-
visibility: visible;
583+
opacity: 1;
614584
}
615585
}
616586

@@ -624,19 +594,19 @@
624594
@-webkit-keyframes popOut {
625595
from {
626596
transform: scale(1);
597+
opacity: 1;
627598
}
628599
to {
629600
transform: scale(0);
630-
visibility: visible;
631601
}
632602
}
633603

634604
@keyframes popOut {
635605
from {
636606
transform: scale(1);
607+
opacity: 1;
637608
}
638609
to {
639610
transform: scale(0);
640-
visibility: visible;
641611
}
642612
}

0 commit comments

Comments
 (0)