如何根据屏幕分辨率触发html / php文件

Question

我正在开发一个wordpress响应网站。但现在我面临问题菜单问题。请参阅我的导航的波纹管图像。在顶部的黑色栏“检查我们的城镇”将有下拉菜单和蓝色栏关于我们也有下拉菜单

所以我希望当屏幕分辨率低于800时，顶部菜单和徽标部分将会有所不同。我知道一种方式，我可以制作单独的标题部分，然后通过CSS隐藏它，并通过CSS媒体查询调用它。因为我需要将代码始终保持在正文中。但我不想要它我希望它只有在需要时代码才会在体内。

如果我可以调用它，如果我可以调用它，如果屏幕分辨率将800/480等，这将是有用的工作，我猜。我可以通过php / js但我不知道如何。

看图像有两个部分用于导航，一个是黑色区域，另一个是蓝色区域。当我将低于800px时，它将是所有菜单中的一个下拉。

请参阅下面的菜单我希望此类型的屏幕分辨率低于800px

Answer 1

我不建议使用ajax加载2个导航。它增加了额外的http请求，这比仅为桌面和移动设备提供所需的额外标记要慢。

我认为使用媒体查询是您最好的方法。

这是我认为你正在尝试的东西： http://jsfiddle.net/krismeister/CNr5y/

相关部分是 @media screen and (min-width:800px){

Answer 2

我认为实现它的唯一方法是使用ajax。将空页发送到客户端，检查窗口大小，并通过ajax以屏幕宽度作为参数请求内容。

Answer 3

我对jquery和json不是很好..你瞧瞧还行吗？

$(function() {
    $.post('some_script.php', { width: 800px }, function(json) {
        if(json.outcome == 'success') {
           header-800px.php;
        } else {
            header.php;
        }
    },'json');
});

参考：Getting the screen resolution using PHP