diff --git a/css/parse.php b/css/parse.php new file mode 100644 index 0000000..a0d6b53 --- /dev/null +++ b/css/parse.php @@ -0,0 +1,22 @@ +
diff --git a/js/main.js b/js/main.js index 10b951a..8dcb964 100644 --- a/js/main.js +++ b/js/main.js @@ -33,30 +33,25 @@ function hideMenu() { } $(function () { - function setRem() { - var whdef = 100 / 1920;// 表示1920的设计图,使用100PX的默认值 1rem = 100px - var wH = window.innerHeight;// 当前窗口的高度 - var wW = window.innerWidth;// 当前窗口的宽度 - var rem = wW * whdef;// 以默认比例值乘以当前窗口宽度,得到该宽度下的相应FONT-SIZE值 - $('html').css('font-size', rem + "px"); - $(window).resize(function () { - var whdef = 100 / 1920;// 表示1920的设计图,使用100PX的默认值 - var wH = window.innerHeight;// 当前窗口的高度 - var wW = window.innerWidth;// 当前窗口的宽度 - var rem = wW * whdef;// 以默认比例值乘以当前窗口宽度,得到该宽度下的相应FONT-SIZE值 - $('html').css('font-size', rem + "px"); - }); + function getRem() { + let windowWidth = window.innerWidth + return windowWidth * (100 / (windowWidth > 768 ? 1920 : 750)); } - setRem(); + function rszcal() { + $('html').css('font-size', getRem() + "px"); + } + $(window).resize(rszcal); + rszcal(); + let currentRem = getRem(); $('.header .menu-group').load('../common/header.html'); $('.footer').load('../common/footer.html'); $(window).scroll(function () { let t = $(document).scrollTop(), flag; if ($(window).width() > 768) { - flag = t > 400; + flag = t > 4 * currentRem; } else { - flag = t > 60; + flag = t > 0.6 * currentRem; } if (flag) { header.removeClass('style1').addClass('style2'); @@ -74,7 +69,7 @@ $(function () { let id = $(this).attr('href'); let ot = $(id)[0].offsetTop; window.scrollTo({ - top: ot - 90, + top: ot - (0.9 * currentRem), behavior: "smooth", }); }); diff --git a/story.html b/story.html index 85116e5..ed220a5 100644 --- a/story.html +++ b/story.html @@ -56,12 +56,14 @@