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 |
| |
|
147 |
144 (*)
|
|
|
| |
|
146 |
143 (*)
|
TP |
|
| |
|
145 |
142 (*)
|
26.1 |
|
| 11 |
141 (*)
|
144 |
141 (*)
|
26.0 |
122 (*)
|
| 10 |
140 (*)
|
143 |
140 (*)
|
18.5-18.6 |
121 (*)
|
| 9 |
139 (*)
|
142 |
139 (*)
|
18.4 |
120 (*)
|
| 8 |
138 (*)
|
141 |
138 (*)
|
18.3 |
119 (*)
|
|
Show all
|
| 7 |
137 (*)
|
140 |
137 (*)
|
18.2 |
118 (*)
|
| 6 |
136 (*)
|
139 |
136 (*)
|
18.1 |
117 (*)
|
| 5.5 |
135 (*)
|
138 |
135 (*)
|
18.0 |
116 (*)
|
| |
134 (*)
|
137 |
134 (*)
|
17.6 |
115 (*)
|
| |
133 (*)
|
136 |
133 (*)
|
17.5 |
114 (*)
|
| |
132 (*)
|
135 |
132 (*)
|
17.4 |
113 (*)
|
| |
131 (*)
|
134 |
131 (*)
|
17.3 |
112 (*)
|
| |
130 (*)
|
133 |
130 (*)
|
17.2 |
111 (*)
|
| |
129 (*)
|
132 |
129 (*)
|
17.1 |
110 (*)
|
| |
128 (*)
|
131 |
128 (*)
|
17.0 |
109 (*)
|
| |
127 (*)
|
130 |
127 (*)
|
16.6 |
108 (*)
|
| |
126 (*)
|
129 |
126 (*)
|
16.5 |
107 (*)
|
| |
125 (*)
|
128 |
125 (*)
|
16.4 |
106 (*)
|
| |
124 (*)
|
127 |
124 (*)
|
16.3 |
105 (*)
|
| |
123 (*)
|
126 |
123 (*)
|
16.2 |
104 (*)
|
| |
122 (*)
|
125 |
122 (*)
|
16.1 |
103 (*)
|
| |
121 (*)
|
124 |
121 (*)
|
16.0 |
102 (*)
|
| |
120 (*)
|
123 |
120 (*)
|
15.6 |
101 (*)
|
| |
119 (*)
|
122 |
119 (*)
|
15.5 |
100 (*)
|
| |
118 (*)
|
121 |
118 (*)
|
15.4 |
99 (*)
|
| |
117 (*)
|
120 |
117 (*)
|
15.2-15.3 |
98 (*)
|
| |
116 (*)
|
119 |
116 (*)
|
15.1 |
97 (*)
|
| |
115 (*)
|
118 |
115 (*)
|
15 |
96 (*)
|
| |
114 (*)
|
117 |
114 (*)
|
14.1 |
95 (*)
|
| |
113 (*)
|
116 |
113 (*)
|
14 |
94 (*)
|
| |
112 (*)
|
115 |
112 (*)
|
13.1 |
93 (*)
|
| |
111 (*)
|
114 |
111 (*)
|
13 |
92 (*)
|
| |
110 (*)
|
113 |
110 (*)
|
12.1 |
91 (*)
|
| |
109 (*)
|
112 |
109 (*)
|
12 |
90 (*)
|
| |
108 (*)
|
111 |
108 (*)
|
11.1 |
89 (*)
|
| |
107 (*)
|
110 |
107 (*)
|
11 |
88 (*)
|
| |
106 (*)
|
109 |
106 (*)
|
10.1 |
87 (*)
|
| |
105 (*)
|
108 |
105 (*)
|
10 |
86 (*)
|
| |
104 (*)
|
107 |
104 (*)
|
9.1 (*)
|
85 (*)
|
| |
103 (*)
|
106 |
103 (*)
|
9 (*)
|
84 (*)
|
| |
102 (*)
|
105 |
102 (*)
|
8 (*)
|
83 (*)
|
| |
101 (*)
|
104 |
101 (*)
|
7.1 (*)
|
82 (*)
|
| |
100 (*)
|
103 |
100 (*)
|
7 (*)
|
81 (*)
|
| |
99 (*)
|
102 |
99 (*)
|
6.1 (*)
|
80 (*)
|
| |
98 (*)
|
101 |
98 (*)
|
6 (*)
|
79 (*)
|
| |
97 (*)
|
100 |
97 (*)
|
5.1 (*)
|
78 (*)
|
| |
96 (*)
|
99 |
96 (*)
|
5 |
77 (*)
|
| |
95 (*)
|
98 |
95 (*)
|
4 |
76 (*)
|
| |
94 (*)
|
97 |
94 (*)
|
3.2 |
75 (*)
|
| |
93 (*)
|
96 |
93 (*)
|
3.1 |
74 (*)
|
| |
92 (*)
|
95 |
92 (*)
|
|
73 (*)
|
| |
91 (*)
|
94 |
91 (*)
|
|
72 (*)
|
| |
90 (*)
|
93 |
90 (*)
|
|
71 (*)
|
| |
89 (*)
|
92 |
89 (*)
|
|
70 (*)
|
| |
88 (*)
|
91 |
88 (*)
|
|
69 (*)
|
| |
87 (*)
|
90 |
87 (*)
|
|
68 (*)
|
| |
86 (*)
|
89 |
86 (*)
|
|
67 (*)
|
| |
85 (*)
|
88 |
85 (*)
|
|
66 (*)
|
| |
84 (*)
|
87 |
84 (*)
|
|
65 (*)
|
| |
83 (*)
|
86 |
83 (*)
|
|
64 (*)
|
| |
81 (*)
|
85 |
81 (*)
|
|
63 (*)
|
| |
80 (*)
|
84 |
80 (*)
|
|
62 (*)
|
| |
79 (*)
|
83 |
79 (*)
|
|
60 (*)
|
| |
18 |
82 |
78 (*)
|
|
58 (*)
|
| |
17 |
81 |
77 (*)
|
|
57 (*)
|
| |
16 |
80 |
76 (*)
|
|
56 (*)
|
| |
15 |
79 |
75 (*)
|
|
55 (*)
|
| |
14 |
78 |
74 (*)
|
|
54 (*)
|
| |
13 |
77 |
73 (*)
|
|
53 (*)
|
| |
12 |
76 |
72 (*)
|
|
52 (*)
|
| |
|
75 |
71 (*)
|
|
51 (*)
|
| |
|
74 |
70 (*)
|
|
50 (*)
|
| |
|
73 |
69 (*)
|
|
49 (*)
|
| |
|
72 |
68 (*)
|
|
48 (*)
|
| |
|
71 |
67 (*)
|
|
47 (*)
|
| |
|
70 |
66 (*)
|
|
46 (*)
|
| |
|
69 |
65 (*)
|
|
45 (*)
|
| |
|
68 |
64 (*)
|
|
44 (*)
|
| |
|
67 |
63 (*)
|
|
43 (*)
|
| |
|
66 |
62 (*)
|
|
42 (*)
|
| |
|
65 |
61 (*)
|
|
41 (*)
|
| |
|
64 |
60 (*)
|
|
40 (*)
|
| |
|
63 |
59 (*)
|
|
39 (*)
|
| |
|
62 |
58 (*)
|
|
38 (*)
|
| |
|
61 |
57 (*)
|
|
37 (*)
|
| |
|
60 |
56 (*)
|
|
36 (*)
|
| |
|
59 |
55 (*)
|
|
35 (*)
|
| |
|
58 |
54 (*)
|
|
34 (*)
|
| |
|
57 |
53 (*)
|
|
33 (*)
|
| |
|
56 |
52 (*)
|
|
32 (*)
|
| |
|
55 |
51 (*)
|
|
31 (*)
|
| |
|
54 |
50 (*)
|
|
30 (*)
|
| |
|
53 |
49 (*)
|
|
29 (*)
|
| |
|
52 |
48 (*)
|
|
28 (*)
|
| |
|
51 |
47 (*)
|
|
27 (*)
|
| |
|
50 |
46 (*)
|
|
26 (*)
|
| |
|
49 |
45 (*)
|
|
25 (*)
|
| |
|
48 |
44 (*)
|
|
24 (*)
|
| |
|
47 |
43 (*)
|
|
23 (*)
|
| |
|
46 |
42 (*)
|
|
22 (*)
|
| |
|
45 |
41 (*)
|
|
21 (*)
|
| |
|
44 |
40 (*)
|
|
20 (*)
|
| |
|
43 |
39 (*)
|
|
19 (*)
|
| |
|
42 |
38 (*)
|
|
18 (*)
|
| |
|
41 |
37 (*)
|
|
17 (*)
|
| |
|
40 |
36 (*)
|
|
16 (*)
|
| |
|
39 |
35 (*)
|
|
15 (*)
|
| |
|
38 |
34 (*)
|
|
12.1 |
| |
|
37 |
33 (*)
|
|
12 |
| |
|
36 |
32 (*)
|
|
11.6 |
| |
|
35 |
31 (*)
|
|
11.5 |
| |
|
34 |
30 (*)
|
|
11.1 |
| |
|
33 |
29 (*)
|
|
11 |
| |
|
32 |
28 (*)
|
|
10.6 |
| |
|
31 |
27 (*)
|
|
10.5 |
| |
|
30 |
26 (*)
|
|
10.0-10.1 |
| |
|
29 |
25 (*)
|
|
9.5-9.6 |
| |
|
28 |
24 (*)
|
|
9 |
| |
|
27 |
23 (*)
|
|
|
| |
|
26 |
22 (*)
|
|
|
| |
|
25 |
21 (*)
|
|
|
| |
|
24 |
20 (*)
|
|
|
| |
|
23 |
19 (*)
|
|
|
| |
|
22 |
18 (*)
|
|
|
| |
|
21 |
17 (*)
|
|
|
| |
|
20 |
16 |
|
|
| |
|
19 |
15 |
|
|
| |
|
18 |
14 |
|
|
| |
|
17 |
13 |
|
|
| |
|
16 |
12 |
|
|
| |
|
15 |
11 |
|
|
| |
|
14 |
10 |
|
|
| |
|
13 |
9 |
|
|
| |
|
12 |
8 |
|
|
| |
|
11 |
7 |
|
|
| |
|
10 |
6 |
|
|
| |
|
9 |
5 |
|
|
| |
|
8 |
4 |
|
|
| |
|
7 |
|
|
|
| |
|
6 |
|
|
|
| |
|
5 |
|
|
|
| |
|
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 |
| 26.1 |
|
|
|
|
|
|
|
|
|
|
|
|
| 26.0 |
all |
141 (*)
|
10 |
80 (*)
|
141 (*)
|
143 |
11 |
15.5 (*)
|
28 (*)
|
14.9 (*)
|
13.52 (*)
|
3.0-3.1 |
| 18.5-18.6 |
|
4.4.3-4.4.4 (*)
|
7 |
12.1 |
|
|
10 |
|
27 (*)
|
|
|
2.5 |
| 18.4 |
|
4.4 (*)
|
|
12 |
|
|
|
|
26 (*)
|
|
|
|
| 18.3 |
|
4.2-4.3 |
|
11.5 |
|
|
|
|
25 (*)
|
|
|
|
|
Show all
|
| 18.2 |
|
4.1 |
|
11.1 |
|
|
|
|
24 (*)
|
|
|
|
| 18.1 |
|
4 |
|
11 |
|
|
|
|
23 (*)
|
|
|
|
| 18.0 |
|
3 |
|
10 |
|
|
|
|
22 (*)
|
|
|
|
| 17.6-17.7 |
|
2.3 |
|
|
|
|
|
|
21 (*)
|
|
|
|
| 17.5 |
|
2.2 |
|
|
|
|
|
|
20 (*)
|
|
|
|
| 17.4 |
|
2.1 |
|
|
|
|
|
|
19.0 (*)
|
|
|
|
| 17.3 |
|
|
|
|
|
|
|
|
18.0 (*)
|
|
|
|
| 17.2 |
|
|
|
|
|
|
|
|
17.0 (*)
|
|
|
|
| 17.1 |
|
|
|
|
|
|
|
|
16.0 (*)
|
|
|
|
| 17.0 |
|
|
|
|
|
|
|
|
15.0 (*)
|
|
|
|
| 16.6-16.7 |
|
|
|
|
|
|
|
|
14.0 (*)
|
|
|
|
| 16.5 |
|
|
|
|
|
|
|
|
13.0 (*)
|
|
|
|
| 16.4 |
|
|
|
|
|
|
|
|
12.0 (*)
|
|
|
|
| 16.3 |
|
|
|
|
|
|
|
|
11.1-11.2 (*)
|
|
|
|
| 16.2 |
|
|
|
|
|
|
|
|
10.1 (*)
|
|
|
|
| 16.1 |
|
|
|
|
|
|
|
|
9.2 (*)
|
|
|
|
| 16.0 |
|
|
|
|
|
|
|
|
8.2 (*)
|
|
|
|
| 15.6-15.8 |
|
|
|
|
|
|
|
|
7.2-7.4 (*)
|
|
|
|
| 15.5 |
|
|
|
|
|
|
|
|
6.2-6.4 (*)
|
|
|
|
| 15.4 |
|
|
|
|
|
|
|
|
5.0-5.4 (*)
|
|
|
|
| 15.2-15.3 |
|
|
|
|
|
|
|
|
4 (*)
|
|
|
|
| 15.0-15.1 |
|
|
|
|
|
|
|
|
|
|
|
|
| 14.5-14.8 |
|
|
|
|
|
|
|
|
|
|
|
|
| 14.0-14.4 |
|
|
|
|
|
|
|
|
|
|
|
|
| 13.4-13.7 |
|
|
|
|
|
|
|
|
|
|
|
|
| 13.3 |
|
|
|
|
|
|
|
|
|
|
|
|
| 13.2 |
|
|
|
|
|
|
|
|
|
|
|
|
| 13.0-13.1 |
|
|
|
|
|
|
|
|
|
|
|
|
| 12.2-12.5 |
|
|
|
|
|
|
|
|
|
|
|
|
| 12.0-12.1 |
|
|
|
|
|
|
|
|
|
|
|
|
| 11.3-11.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