[JavaScript]Update text size by detecting window resizing

0

It is an implementation that detects a change in window size and changes the percentage of text size and image size.
I explain it using jQuery in the mood somehow.I think that it can be applied to other frameworks such as Vue.js.

var w = window.innerWidth;

// detect window width resize
jQuery(window).resize(function() {
    baseFontDeside();
});

// deside window size
function baseFontDeside () {
    if (w >= 768) {
        var baseFontSize = w/73;
        jQuery('html').css('font-size',baseFontSize + 'px');
    } else if (w >= 576) {
        var baseFontSize = w/46;
        jQuery('html').css('font-size',baseFontSize + 'px');
    } else {
        jQuery('html').css('font-size','medium');
    }
}

A reference article when getting window width and detecting changes in Vue.js.
See the supplementary part of the link below
β†’Note:Detect and change screen resizing

BaseFontDeside() sets the font size as a percentage depending on the screen width.