ion-affix
ion-affix copied to clipboard
Ionic Framework 1.2 support
I know you're officially not maintaining this project any longer, but do you think you can update it to work with the latest Ionic Framework update v1.2?
Thanks in advance, JLNNN
+1
I'm still getting scrollTop is undefined with that fix. Looks like event.originalEvent doesn't contain a .detail
Has anyone had any luck fixing this issue?
It works on ionic 1.2.4
Yeah it's working for me on ios & web with 1.2.4, but not android with and without crosswalks.
FYI if anyone comes looking here to solve this issue for Android, it can be solved by disabling Native Scrolling on the ion-scroll that you want to ion-affix with. Native Scroll is awesome, but it breaks anything that was depending on "scrollTop" from the Ionic scroll event. To disable globally:
$ionicConfigProvider.scrolling.jsScrolling(true);
Otherwise, you can do:
<ion-scroll overflow-scroll="false">
<!-- list or whatever -->
</ion-scroll>
More: http://blog.ionic.io/native-scrolling-in-ionic-a-tale-in-rhyme/
Reason
The error is at line 182 where ion-affix tries to read the "scrollTop" property of the event. The native scrolling even does not include that information (specifically, the "originalEvent" and "detail" properties are missing on a native scroll event). So, simply enabling JS scroll on that item fixes it. I've got a crap android device, and the scroll still seems pretty smooth using XWalk.
Hope this helps someone!
Changing
var scrollTop = (event.detail || event.originalEvent && event.originalEvent.detail).scrollTop;
to
var scrollTop = event.target.scrollTop;
~~It works (scrolltop position), but the native scrolling not working yet, because fixed elements is not "showing", but "behind the scene" (on top) the process is ok.~~ (really? I don't know!)
I tryed changing this line angular.element($ionicScroll.element).append(clone);
using after(clone), but without success.
PS: sorry my english :)
I usually fix those kind of scroll problem by using code below. (This supports both native and js scroll)
var event = event.originalEvent || event;
var scrollTop = event.detail ? event.detail.scrollTop : event.target.scrollTop;
Wow thank you so much @darron1217 It works on other scroll problems too!