CODEWITHSUNDEEP
ionic-frameworkionic4
Dinesh Vishwakarma
Dinesh Vishwakarma

Reputation: 666

How to show\Hide button according to scrolling in ionic4

enter image description hereI want to use scrollToTop in my ionic project . In my code scrollToTop working but i am want to show button when scroll the content in ionic . How to show sticky button in ionic please help me... In images my button show at end want to show at middle and show when i am scrolling..

tab1.page.html

        <ion-content cache-view="false" (ionScrollStart)="logScrollStart()" (ionScroll)="logScrolling($event)"
          (ionScrollEnd)="logScrollEnd()" [scrollEvents]="true">
        <button class="scroll"  (click)="ScrollToTop()">
              <ion-icon name="arrow-dropup-circle"></ion-icon>
            </button>
            </ion-content>

tab1.page.ts

ScrollToTop(){
    this.content.scrollToTop(1500);
  }

Upvotes: 1

Views: 950

Answers (1)

Cyril Hanquez
Cyril Hanquez

Reputation: 698

For the "when I'm scrolling", you can detect if your heart icon is visible in your scroll-able card with something like:

How to Check if element is visible after scrolling?

Upvotes: 1

Related Questions