使用jq开发pc网页时,自适应解决方案

2021-07-27  本文已影响0人  嵩鼠
/* 自适应 */
function basefont() {
    var whdef = 100 / 1920; // 表示1920的设计图,使用100PX的默认值
    var wH = window.innerHeight; // 当前窗口的高度
    var wW = window.innerWidth; // 当前窗口的宽度
    var rem = wW * whdef; // 以默认比例值乘以当前窗口宽度,得到该宽度下的相应font-size值
    rem = rem > 100 ? 100 : rem;
    $('html').css('font-size', rem + "px");
}

// 当DOM结构加载完成后自动执行此函数,并且调用适配函数
document.addEventListener('DOMContentLoaded', () => {
    this.basefont()
}, false);

// 当页面变化时候触发此函数,并且重新调用适配函数
$(window).resize(function() {
    this.basefont()
});

上一篇下一篇

猜你喜欢

热点阅读