I am currently working on an Angular project and facing a challenge with setting the font size dynamically in a table. I have created a function to address this issue, which includes the following code snippet:
$('.td').css({
'font-size': Number(this.f) + 'px'
});
//Mobile
$('.mobileTdLong').css({
'width': Number(this.f) + 150 + 'px'
});
$('.mobileTdShort').css({
'width': Number(this.f) + 40 + 'px'
});
//Desktop
$('.tableDesktopShort').css({
'width': Number(this.f) + 100 + 'px'
});
It is important to note that the variable f is obtained from user input.
Although the provided code changes the font size dynamically based on the user input every 10 seconds when the data refreshes, it does not apply the change permanently to the table. It appears as a flicker effect, transitioning from the default size of 20px to the value entered by the user (this.f).
Your assistance in finding a more effective solution for this issue would be greatly appreciated. Thank you.