我的工作项目由网格显示的内容。我想在网格中各项调整到第四个视口的大小。这会很容易与JavaScript，但有一些需要注意的每个项目的大小的后端东西：

The project I am working on consists of a grid showing content. I would like to resize each item on the grid to a fourth of the viewport's size. This would be very easy with Javascript, but there is some backend stuff that needs to be aware of the size of each item:

我使用Timthumb项的图像调整到其appropiate的大小，所以我需要检测视口的宽度，并发送此时，相应的值（视口的宽度/ 4），供应每个项目的PHP，所以它告诉Timthumb此时，相应尺寸来使用。

I am using Timthumb to resize the image of item to its appropiate size, so I would need to detect the viewport's width, and send the appropiate value (the viewport's width / 4) to the php that serves each item, so it tells Timthumb the appropiate size to use.

什么是对这个问题最好的办法？

What would be the best approach to this problem?

推荐答案

如何申请页面，在$如果（文件）。就绪，检测视口的大小使用jQuery，并通过它的AJAX请求？

How about when requesting the page, in $(document).ready, detect the size of viewport using jQuery and pass it in an AJAX request?

$(document).ready(function () {
    var height = $(window).height();
    var width = $(window).width();
    $.ajax({
        type: 'POST',
        url: image.php,
        data: {
            "height": height,
            "width": width
        },
        success: function (data) {
            $("#viewarea").html(data);
        },
    });
});

在PHP端你可以得到它，并返回数据。

at PHP side you can just get it and return the data

$_POST['height']
$_POST['width']