javascript已检测到如何将屏幕分辨率数据调整为适用于Web

Question

我已经浏览并在所有互联网上寻找解决方案，但是这个问题似乎很难解决。 关于如何检测用户的屏幕分辨率，有很多教程。 这是通过innerWidth和innerHeight完成的。 我的问题将是下一步。 您应该使用哪种代码将这些信息适应整个网站？

因此，一旦获得了innerWidth和innerHeight的值，您将如何使用此信息并将其适应整个Web布局？！？！

我有这个类似的代码，可以加载图片并使它们适应屏幕分辨率，它可以正常工作。 但是，如何转换此代码以使整个网络适应用户的屏幕分辨率？ 我应该将其标记为html吗？！？！ 你怎么做到这一点？！？！

PS我正在使用分辨率为1440x900的计算机。 在此分辨率下看起来不错，但一旦分辨率变小或变大，它就会崩溃...

$(window).load(function() {
    var randomImages = ['img1','img2','img3','img4','img5'];
    var rndNum = Math.floor(Math.random() * randomImages.length);

     var $win = $(this);
     var iMac = $(window).width() > 1920 ? '_imac' : '';
     var $img = $('#background').attr('src', '_img/bg/index_rnd/' + randomImages[rndNum] + iMac + '.jpg').css({'position':'fixed','top':0,'left':0});
        function resize() {
            if (($win.width() / $win.height()) < ($img.width() / $img.height())) {
              $img.css({'height':'100%','width':'auto'});
            } else {
              $img.css({'width':'100%','height':'auto'});
            }
        }
        $win.resize(function() { resize(); }).trigger('resize');
    });

Answer 1

设置document.documentElement.style.maxHeight和document.documentElement.style.maxWidth

---

实际上，在重新阅读您的问题时，您要求的是“缩放”之类的内容，您可以使用body {transform: scale(sw, sh)}
其中sw是$win.width() / 1440而sh是$win.height() / 900 （或宽度的宽高比正确版本，如果不想更改，则为1 ）
transform尚未完全实现，因此您需要-webkit-transform ， -moz-transform ， -o-transform和transform