javascript - 在加载页面之前根据屏幕分辨率调整所有图像的大小

Question

我找不到适合我的解决方案，我尝试过的方法都不起作用:(

我需要：

在显示页面内容之前获取屏幕分辨率，然后根据它调整img页面上所有 -s 的大小。

好的，我尝试过的：

<script type="text/javascript">

 $(window).load(function() {

 var img = document.images;

 if (screen.width <= 699) {  

   for (var i = 0; i < img.length; i++) {


         img[i].height = 200px;


         img[i].width = 200px;
   }

   }

 })


</script>

Answer 1

一些非常老式的 JavaScript 应该可以解决问题。

<script>
if(screen.width > 699) {
    document.write('<style>img { width: 200px; height: 200px; }</style>');
}
</script>

虽然重新思考你的设计理念会更好！请记住，有些人可能没有最大化他们的浏览器，或者可能想要设置他们自己的缩放设置。