Ionic want e.detail.scrollBottom
.directive('scrollWatch', function($rootScope) {
return function(scope, elem, attr) {
var start = 0;
var threshold = 150;
elem.bind('scroll', function(e) {
if(e.detail.scrollTop - start > threshold) {
$rootScope.slideHeader = true;
} else {
$rootScope.slideHeader = false;
}
console.log('e'+ e.detail.scrollTop);
if ($rootScope.slideHeaderPrevious >= e.detail.scrollTop - start) {
$rootScope.slideHeader = false;
}
console.log($rootScope.slideHeader);
$rootScope.slideHeaderPrevious = e.detail.scrollTop - start;
$rootScope.$apply();
});
};
})
This will give me e.detail.scrollTop But I want e.detail.scrollBottom. I cannot get around this. help me
+3
source to share
1 answer
Simple! The basic formula for scrollbottom is
$(document).height() - $(#element).scrollTop() - $(#element).height();
since I don't have all the code, I cannot give an exact solution. But with some trail you can get it. Just follow the formula.
i.e
document height - current element position - current element window height
and your code will be like this.
.directive('scrollWatch', function($rootScope) {
return function(scope, elem, attr) {
var start = 0;
var threshold = 150;
elem.bind('scroll', function(e) {
if(e.detail.scrollTop - start > threshold) {
$rootScope.slideHeader = true;
} else {
$rootScope.slideHeader = false;
}
console.log('e'+ e.detail.scrollTop);
if ($rootScope.slideHeaderPrevious >= e.detail.scrollTop - start) {
$rootScope.slideHeader = false;
}
console.log($rootScope.slideHeader);
$rootScope.slideHeaderPrevious = $(document).height()-e.detail.scrollTop - e.detail.height();
$rootScope.$apply();
});
};
})
0
source to share