I have this code:
function resizePage() {
var screenHeight = window.screen.height;
var screenWidth = window.screen.width;
var docHeight = $(document).height();
var docWidth = $(document).width();
var dbsFS = Math.round(100*(20*((docHeight+docWidth)/((screenHeight-(120))+screenWidth))))/100;
document.body.style.fontSize = dbsFS+"px";
alert("Height: "+((screenHeight-120)-docHeight)+" Width: "+docWidth+" Font Size: "+dbsFS);
}
resizePage();
$(window).resize(function() {resizePage();});
It doesn't work correctly, but it should, whenever I resize the window, instead of the text getting smaller, it gets bigger, but it works as intended when you refresh the page, it doesn't make sense.
So here is a gif of what it's doing:
![](https://uploads.gamedev.net/forums/monthly_2023_02/9b43f43aa51b4740abc3d29b03cb41a5.Untitled_-Feb-17,-2023-8_05-AM.gif)
As you can see, when I resize the window instead of changing the font size to match the viewport it just makes the font size bigger, but when I refresh the page it goes to what the font size should be at, I don't know why it is doing this. Can anyone help me understand what is happening and how to fix it? I am stumped.