Hope someone can help me with my problem:
I have a content full of data, of which I scroll through and have a next() button in my footer which handles several tasks. The next button is a fixed div overlapping the content (50% transparent starting from mid to bottom). I would like to make the footer’s next button div to be able to handle the content’s scroller too, on top of having the button effect.
Assigning next() to the content is not an option.
<ion-content padding #myContent [scrollEvents]="true" (ionScroll)="test2($event)">
</ion-content>
<ion-footer>
<div *ngIf="nextButtonHolder">
<div *ngIf="nextButton" class="next" (click)="next()" id="nextID" [scrollEvents]="true" (ionScroll)="test($event)"></div>
</div>
</ion-footer>
Code in TS and what I tried is: getting the scrollevents for both layers then matching the scrolltop and scrollleft value of next class with the contents’:
test($event) {
$event.scrollTop = this.test2($event.scrollTop);
$event.scrollLeft = this.test2($event.scrollLeft);
console.log($event.detail.scrollTop);
console.log($event.detail.startY);
}
test2($event) {
console.log($event.detail.scrollTop);
console.log($event.detail.startY);
}
Maybe I’m missing something. What would be your solution?