CSS Cross-Fade Function
Image function to create a "crossfade" between images. This allows one image to transition (fade) into another based on a percentage value.
| IE |
Edge |
Firefox |
Chrome |
Safari |
Opera |
| |
|
|
108 (*)
|
|
|
| |
|
107 |
107 (*)
|
TP |
|
| |
|
106 |
106 (*)
|
16.1 |
|
| 11 |
105 (*)
|
105 |
105 (*)
|
16.0 |
91 (*)
|
| 10 |
104 (*)
|
104 |
104 (*)
|
15.6 |
90 (*)
|
| 9 |
103 (*)
|
103 |
103 (*)
|
15.5 |
89 (*)
|
| 8 |
102 (*)
|
102 |
102 (*)
|
15.4 |
88 (*)
|
|
Show all
|
| 7 |
101 (*)
|
101 |
101 (*)
|
15.2-15.3 |
87 (*)
|
| 6 |
100 (*)
|
100 |
100 (*)
|
15.1 |
86 (*)
|
| 5.5 |
99 (*)
|
99 |
99 (*)
|
15 |
85 (*)
|
| |
98 (*)
|
98 |
98 (*)
|
14.1 |
84 (*)
|
| |
97 (*)
|
97 |
97 (*)
|
14 |
83 (*)
|
| |
96 (*)
|
96 |
96 (*)
|
13.1 |
82 (*)
|
| |
95 (*)
|
95 |
95 (*)
|
13 |
81 (*)
|
| |
94 (*)
|
94 |
94 (*)
|
12.1 |
80 (*)
|
| |
93 (*)
|
93 |
93 (*)
|
12 |
79 (*)
|
| |
92 (*)
|
92 |
92 (*)
|
11.1 |
78 (*)
|
| |
91 (*)
|
91 |
91 (*)
|
11 |
77 (*)
|
| |
90 (*)
|
90 |
90 (*)
|
10.1 |
76 (*)
|
| |
89 (*)
|
89 |
89 (*)
|
10 |
75 (*)
|
| |
88 (*)
|
88 |
88 (*)
|
9.1 (*)
|
74 (*)
|
| |
87 (*)
|
87 |
87 (*)
|
9 (*)
|
73 (*)
|
| |
86 (*)
|
86 |
86 (*)
|
8 (*)
|
72 (*)
|
| |
85 (*)
|
85 |
85 (*)
|
7.1 (*)
|
71 (*)
|
| |
84 (*)
|
84 |
84 (*)
|
7 (*)
|
70 (*)
|
| |
83 (*)
|
83 |
83 (*)
|
6.1 (*)
|
69 (*)
|
| |
81 (*)
|
82 |
81 (*)
|
6 (*)
|
68 (*)
|
| |
80 (*)
|
81 |
80 (*)
|
5.1 (*)
|
67 (*)
|
| |
79 (*)
|
80 |
79 (*)
|
5 |
66 (*)
|
| |
18 |
79 |
78 (*)
|
4 |
65 (*)
|
| |
17 |
78 |
77 (*)
|
3.2 |
64 (*)
|
| |
16 |
77 |
76 (*)
|
3.1 |
63 (*)
|
| |
15 |
76 |
75 (*)
|
|
62 (*)
|
| |
14 |
75 |
74 (*)
|
|
60 (*)
|
| |
13 |
74 |
73 (*)
|
|
58 (*)
|
| |
12 |
73 |
72 (*)
|
|
57 (*)
|
| |
|
72 |
71 (*)
|
|
56 (*)
|
| |
|
71 |
70 (*)
|
|
55 (*)
|
| |
|
70 |
69 (*)
|
|
54 (*)
|
| |
|
69 |
68 (*)
|
|
53 (*)
|
| |
|
68 |
67 (*)
|
|
52 (*)
|
| |
|
67 |
66 (*)
|
|
51 (*)
|
| |
|
66 |
65 (*)
|
|
50 (*)
|
| |
|
65 |
64 (*)
|
|
49 (*)
|
| |
|
64 |
63 (*)
|
|
48 (*)
|
| |
|
63 |
62 (*)
|
|
47 (*)
|
| |
|
62 |
61 (*)
|
|
46 (*)
|
| |
|
61 |
60 (*)
|
|
45 (*)
|
| |
|
60 |
59 (*)
|
|
44 (*)
|
| |
|
59 |
58 (*)
|
|
43 (*)
|
| |
|
58 |
57 (*)
|
|
42 (*)
|
| |
|
57 |
56 (*)
|
|
41 (*)
|
| |
|
56 |
55 (*)
|
|
40 (*)
|
| |
|
55 |
54 (*)
|
|
39 (*)
|
| |
|
54 |
53 (*)
|
|
38 (*)
|
| |
|
53 |
52 (*)
|
|
37 (*)
|
| |
|
52 |
51 (*)
|
|
36 (*)
|
| |
|
51 |
50 (*)
|
|
35 (*)
|
| |
|
50 |
49 (*)
|
|
34 (*)
|
| |
|
49 |
48 (*)
|
|
33 (*)
|
| |
|
48 |
47 (*)
|
|
32 (*)
|
| |
|
47 |
46 (*)
|
|
31 (*)
|
| |
|
46 |
45 (*)
|
|
30 (*)
|
| |
|
45 |
44 (*)
|
|
29 (*)
|
| |
|
44 |
43 (*)
|
|
28 (*)
|
| |
|
43 |
42 (*)
|
|
27 (*)
|
| |
|
42 |
41 (*)
|
|
26 (*)
|
| |
|
41 |
40 (*)
|
|
25 (*)
|
| |
|
40 |
39 (*)
|
|
24 (*)
|
| |
|
39 |
38 (*)
|
|
23 (*)
|
| |
|
38 |
37 (*)
|
|
22 (*)
|
| |
|
37 |
36 (*)
|
|
21 (*)
|
| |
|
36 |
35 (*)
|
|
20 (*)
|
| |
|
35 |
34 (*)
|
|
19 (*)
|
| |
|
34 |
33 (*)
|
|
18 (*)
|
| |
|
33 |
32 (*)
|
|
17 (*)
|
| |
|
32 |
31 (*)
|
|
16 (*)
|
| |
|
31 |
30 (*)
|
|
15 (*)
|
| |
|
30 |
29 (*)
|
|
12.1 |
| |
|
29 |
28 (*)
|
|
12 |
| |
|
28 |
27 (*)
|
|
11.6 |
| |
|
27 |
26 (*)
|
|
11.5 |
| |
|
26 |
25 (*)
|
|
11.1 |
| |
|
25 |
24 (*)
|
|
11 |
| |
|
24 |
23 (*)
|
|
10.6 |
| |
|
23 |
22 (*)
|
|
10.5 |
| |
|
22 |
21 (*)
|
|
10.0-10.1 |
| |
|
21 |
20 (*)
|
|
9.5-9.6 |
| |
|
20 |
19 (*)
|
|
9 |
| |
|
19 |
18 (*)
|
|
|
| |
|
18 |
17 (*)
|
|
|
| |
|
17 |
16 |
|
|
| |
|
16 |
15 |
|
|
| |
|
15 |
14 |
|
|
| |
|
14 |
13 |
|
|
| |
|
13 |
12 |
|
|
| |
|
12 |
11 |
|
|
| |
|
11 |
10 |
|
|
| |
|
10 |
9 |
|
|
| |
|
9 |
8 |
|
|
| |
|
8 |
7 |
|
|
| |
|
7 |
6 |
|
|
| |
|
6 |
5 |
|
|
| |
|
5 |
4 |
|
|
| |
|
4 |
|
|
|
| |
|
3.6 |
|
|
|
| |
|
3.5 |
|
|
|
| |
|
3 |
|
|
|
| |
|
2 |
|
|
|
| Safari on iOS |
Opera Mini |
Android Browser |
Blackberry Browser |
Opera Mobile |
Android Chrome |
Android Firefox |
IE Mobile |
Android UC Browser |
Samsung Internet |
QQ Browser |
Baidu Browser |
KaiOS Browser |
| 16.1 |
|
|
|
|
|
|
|
|
|
|
|
|
| 16.0 |
all |
105 (*)
|
10 |
64 (*)
|
105 (*)
|
104 |
11 |
13.4 (*)
|
18.0 (*)
|
13.1 (*)
|
13.18 (*)
|
2.5 |
| 15.6 |
|
4.4.3-4.4.4 (*)
|
7 |
12.1 |
|
|
10 |
|
17.0 (*)
|
|
|
|
| 15.5 |
|
4.4 (*)
|
|
12 |
|
|
|
|
16.0 (*)
|
|
|
|
| 15.4 |
|
4.2-4.3 |
|
11.5 |
|
|
|
|
15.0 (*)
|
|
|
|
|
Show all
|
| 15.2-15.3 |
|
4.1 |
|
11.1 |
|
|
|
|
14.0 (*)
|
|
|
|
| 15.0-15.1 |
|
4 |
|
11 |
|
|
|
|
13.0 (*)
|
|
|
|
| 14.5-14.8 |
|
3 |
|
10 |
|
|
|
|
12.0 (*)
|
|
|
|
| 14.0-14.4 |
|
2.3 |
|
|
|
|
|
|
11.1-11.2 (*)
|
|
|
|
| 13.4-13.7 |
|
2.2 |
|
|
|
|
|
|
10.1 (*)
|
|
|
|
| 13.3 |
|
2.1 |
|
|
|
|
|
|
9.2 (*)
|
|
|
|
| 13.2 |
|
|
|
|
|
|
|
|
8.2 (*)
|
|
|
|
| 13.0-13.1 |
|
|
|
|
|
|
|
|
7.2-7.4 (*)
|
|
|
|
| 12.2-12.5 |
|
|
|
|
|
|
|
|
6.2-6.4 (*)
|
|
|
|
| 12.0-12.1 |
|
|
|
|
|
|
|
|
5.0-5.4 (*)
|
|
|
|
| 11.3-11.4 |
|
|
|
|
|
|
|
|
4 (*)
|
|
|
|
| 11.0-11.2 |
|
|
|
|
|
|
|
|
|
|
|
|
| 10.3 |
|
|
|
|
|
|
|
|
|
|
|
|
| 10.0-10.2 |
|
|
|
|
|
|
|
|
|
|
|
|
| 9.3 (*)
|
|
|
|
|
|
|
|
|
|
|
|
|
| 9.0-9.2 (*)
|
|
|
|
|
|
|
|
|
|
|
|
|
| 8.1-8.4 (*)
|
|
|
|
|
|
|
|
|
|
|
|
|
| 8 (*)
|
|
|
|
|
|
|
|
|
|
|
|
|
| 7.0-7.1 (*)
|
|
|
|
|
|
|
|
|
|
|
|
|
| 6.0-6.1 (*)
|
|
|
|
|
|
|
|
|
|
|
|
|
| 5.0-5.1 (*)
|
|
|
|
|
|
|
|
|
|
|
|
|
| 4.2-4.3 |
|
|
|
|
|
|
|
|
|
|
|
|
| 4.0-4.1 |
|
|
|
|
|
|
|
|
|
|
|
|
| 3.2 |
|
|
|
|
|
|
|
|
|
|
|
|
Notes
-
* Partial support with prefix.
Resources