Header is not getting stick in ios 9.3.1

[hparth]

Header is not getting stick in ios 9.3.1.The possible cause is css property -transform : translate3D is not attaching to headerElement.

ion-affix.ts (Line 77 & 79)
this.renderer.setStyle(this.headerElement, 'transform', `translate3d(0px, ${delta}px, 0px)`);
this.renderer.setStyle(this.headerElement, 'transform', `translate3d(0px, ${contentScrollTop}px, 0px`);

It's working perfect in ios 10.3.

[jonaszuberbuehler]

@hparth Will have a look ASAP.

[hparth]

Thanks. Waiting for it.

[jonaszuberbuehler]

@hparth Quickly tried to reproduce this on iOS Simulator (9.3) w/o luck. Is it failing for you on the simulator?

Besides that it might be related to https://stackoverflow.com/questions/27303339/transform-not-working-on-ios.

[hparth]

I am trying on real device Device - Iphone 6 Plus IOS version - 9.3.1

I checked in debug mode. transform property is not there in headerElement for above device.

To be sure I replace transform with margin-top property, and it worked fine.

[jonaszuberbuehler]

@hparth Ok. Can you replace transform with -webkit-transform and give me a short update? If that works I'll push a small fix.

Thx.

[hparth]

I tried that but no luck. Still facing same issue.

[jonaszuberbuehler]

@hparth Published a possible fix. Can you test it? npm install --save ion-affix@dev

Since I can't test this myself (no old iOS) I need your help. Sry about that.

[hparth]

Thanks man. It worked. Are you planning to make it live?

[jonaszuberbuehler]

Nice! You should be good to go, tag changed to latest on npm, so npm install --save ion-affix should now pull the fixed version.