Fast clicking on tabs occurs bug

[Kristina Ilic]

After fast changing tabs, I get displayed two tab items at the same time, like on the screenshot: Can I prevent this and how?

You can test this behavior on the link below:

https://ej2.syncfusion.com/angular/documentation/tab/how-to/set-custom-animation/

Best regards and thank you on previous replies,

Kristina

[Satheesh Kumar Balasubramanian]

Hi Kristina,

Thanks for using Syncfusion Products.

We have validated your reported query "After fast changing tabs, I get displayed two-tab items at the same time" and let you know that before completing the previous tab animation duration, change the tab quickly causes this issue. We suggest you reduce the animation duration to resolve this reported issue.

Sample: https://stackblitz.com/edit/angular-tab-animation-duration-issue?file=app.component.ts

app.component.ts:  

  public previousAnimationChange(): void {

    this.tabInstance.animation.previous.effect = this.previousInstance

      .value as Effect;

    this.tabInstance.animation.previous.duration = 100;

  }

  public nextAnimationChange(): void {

    this.tabInstance.animation.next.effect = this.nextInstance.value as Effect;

    this.tabInstance.animation.next.duration = 100;

  }

Kindly try the above sample and let us know if this meets your requirement.

Regards,

Satheesh Kumar B

[Kristina Ilic]

Hi Satheesh Kumar B,

This solved my problem, thank you!

[Nevitha Ravi]

Hi Kristina, 

You are most welcome..! we are glad that our solution worked at your end. Please get back to us if you need any further assistance. 

Regards, 

Nevitha.