Topic: SmoothScroll pageScrollEasing Easing method Angular
Hi Guys,
According to your docs: pageScrollEasing accepts type of string which should specify - "Easing method to be used while calculating the scroll position over time (default is linear easing)".
In the example below that, you use:
[pageScrollEasing]="functionName"
Could you please specify what exactly functionName you meant in your example and what exactly this property is expecting? I tried different default names like "ease-out" or like this "easeOut" or even cubic-bezier curve parameters like "0, 0, .58, 1" but nothing seems to work.
What am I missing?
Please try and put them inside the function like this:
myEasing: EasingLogic = {
ease: (t: number, b: number, c: number, d: number): number => {
t = .25;
b = .1;
c = .25;
d = 1;
if (t === 0) return b;
if (t === d) return b + c;
if ((t /= d / 2) < 1) return c / 2 * Math.pow(2, 10 * (t - 1)) + b; return c / 2 * (-Math.pow(2, -10 * --t) + 2) + b; } };
Let me know if this helps.
denis.frolov.mail pro commented 6 years ago
))) it sure does, in not very "user friendly" way though... Thank you Edyta!
[pageScrollEasing]="myEasing" and then define it in your app.component.ts:
myEasing: EasingLogic = {
ease: (t: number, b: number, c: number, d: number): number => {
// easeInOutExpo easing
if (t === 0) return b;
if (t === d) return b + c;
if ((t /= d / 2) < 1) return c / 2 * Math.pow(2, 10 * (t - 1)) + b;
return c / 2 * (-Math.pow(2, -10 * --t) + 2) + b;
}
};
Remember also to add import path:
import { EasingLogic } from 'your-path/typescripts/pro/smoothscroll/index';
Hope this helps.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- ForumUser: Pro
- Premium support: No
- Technology: MDB Angular
- MDB Version: -
- Device: -
- Browser: -
- OS: -
- Provided sample code: Yes
- Provided link: No