如何通过 JavaScript 设置 PHP 变量以隐藏特定视口宽度的图像

Question

您好，我刚刚在我的专用于在线游戏的网站上切换到响应式布局，我正在努力寻找一种方法来根据屏幕尺寸为我的“特色游戏”部分加载不同数量的缩略图。

代码如下所示：

<div class='section-title'><h1 class="text_h1">Featured games</h1> 

</div>

<br class='clear' />

   <div class='flex-container'>

       <div class="feat">

<?php echo akd_list("feat","rand()","7"); ?>

       </div>

   </div>

<br class='clear' />

如您所见，要显示的缩略图数量是在我的 CMS 中的 de akd_list php 函数中手动设置为返回参数的，在本例中设置为 7。

我的需要是根据屏幕尺寸自动设置这个数字，例如如果屏幕分辨率小于 700px，则将此数字设置为 4，如果在 1024 和 1200 之间将其设置为 5，依此类推。

我相信我需要使用一些 javascript 并根据检测到的屏幕大小存储这个数字，然后将其作为参数传递给 akd_list php 输出，但由于我在 javascript 中的编码技能趋于零，我真的很感激一些帮助.