通过Mobile访问时加载Mobile Version，否则加载Desktop Version

Question

有人能解释我如何调用手机时只能调用网站的移动版本，而当我访问大于500px的所有内容时如何称呼网站的桌面版本吗？

我分别创建了一个移动网站和一个桌面网站。 是否可以使用jQuery检查宽度，然后调用移动版或桌面版？

我这样尝试过

在我的桌面版本上：

<link rel="alternate" media="only screen and (max-width: 500px)" href="../FolderPath/index.html" >

在我的移动版上：

<link rel="canonical" href="../FolderPath/index.html">

但我认为我完全错了。

希望有人可以帮助我，在此先感谢:)

Answer 1

如果屏幕尺寸小于500像素，则可以使用JavaScript检测屏幕尺寸并将用户重定向到移动网站

 <script type="text/javascript">
    if (screen.width <= 500) {
        document.location = "mobile/index.html";
    }
 </script>