Skip to content

Commit a2ffa63

Browse files
committed
fix(spinner): works in iOS8
fixes #8145
1 parent 48c7823 commit a2ffa63

File tree

2 files changed

+12
-8
lines changed

2 files changed

+12
-8
lines changed

src/components/spinner/spinner.ts

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { ChangeDetectionStrategy, Component, ElementRef, Input, Renderer, ViewEn
22

33
import { Config } from '../../config/config';
44
import { Ion } from '../ion';
5-
5+
import { CSS } from '../../util/dom';
66
/**
77
* @name Spinner
88
* @description
@@ -232,8 +232,8 @@ const SPINNERS: any = {
232232
y1: 17,
233233
y2: 29,
234234
style: {
235-
transform: 'rotate(' + (30 * index + (index < 6 ? 180 : -180)) + 'deg)',
236-
animationDelay: -(dur - ((dur / total) * index)) + 'ms'
235+
[CSS.transform]: 'rotate(' + (30 * index + (index < 6 ? 180 : -180)) + 'deg)',
236+
[CSS.animationDelay]: -(dur - ((dur / total) * index)) + 'ms'
237237
}
238238
};
239239
}
@@ -247,8 +247,8 @@ const SPINNERS: any = {
247247
y1: 12,
248248
y2: 20,
249249
style: {
250-
transform: 'rotate(' + (30 * index + (index < 6 ? 180 : -180)) + 'deg)',
251-
animationDelay: -(dur - ((dur / total) * index)) + 'ms'
250+
[CSS.transform]: 'rotate(' + (30 * index + (index < 6 ? 180 : -180)) + 'deg)',
251+
[CSS.animationDelay]: -(dur - ((dur / total) * index)) + 'ms'
252252
}
253253
};
254254
}
@@ -263,7 +263,7 @@ const SPINNERS: any = {
263263
style: {
264264
top: 9 * Math.sin(2 * Math.PI * index / total),
265265
left: 9 * Math.cos(2 * Math.PI * index / total),
266-
animationDelay: -(dur - ((dur / total) * index)) + 'ms'
266+
[CSS.animationDelay]: -(dur - ((dur / total) * index)) + 'ms'
267267
}
268268
};
269269
}
@@ -278,7 +278,7 @@ const SPINNERS: any = {
278278
style: {
279279
top: 9 * Math.sin(2 * Math.PI * index / total),
280280
left: 9 * Math.cos(2 * Math.PI * index / total),
281-
animationDelay: -(dur - ((dur / total) * index)) + 'ms'
281+
[CSS.animationDelay]: -(dur - ((dur / total) * index)) + 'ms'
282282
}
283283
};
284284
}
@@ -303,7 +303,7 @@ const SPINNERS: any = {
303303
r: 6,
304304
style: {
305305
left: (9 - (9 * index)),
306-
animationDelay: -(110 * index) + 'ms'
306+
[CSS.animationDelay]: -(110 * index) + 'ms'
307307
}
308308
};
309309
}

src/util/dom.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -72,6 +72,7 @@ export let CSS: {
7272
transitionStart?: string,
7373
transitionEnd?: string,
7474
transformOrigin?: string
75+
animationDelay?: string;
7576
} = {};
7677

7778
(function() {
@@ -113,6 +114,9 @@ export let CSS: {
113114

114115
// transform origin
115116
CSS.transformOrigin = (isWebkit ? '-webkit-' : '') + 'transform-origin';
117+
118+
// animation delay
119+
CSS.animationDelay = (isWebkit ? 'webkitAnimationDelay' : 'animationDelay');
116120
})();
117121

118122

0 commit comments

Comments
 (0)