1

我一直在我的网站上工作并对其进行最后润色，以便我可以在我即将毕业后开始找工作时向雇主展示它。我建立了一个使用视差滚动的“关于”部分......问题是，它在移动设备上的任何容量都不起作用。至少不好。这是我所指的：http ://www.jordanmorgan.net/about.html

我想做的是，如果它们在宽度小于 900 像素或任何数量的设备上，只需将它们全部废弃。我宁愿只显示一个传统的关于我的页面。那么我怎么能写一些 javascript 来确定他们正在使用什么设备，并显示不同的 HTML 或在需要时一起转到不同的页面（如果它们在所述设备上）。

任何关于如何最好地解决问题的建议都会很好，谢谢！

4

3 回答 3

3

我今天实际上一直在研究这个，我想出了以下功能......

function isMobile() {
    return (typeof window.orientation !== 'undefined');
}

这通过方向是否可以改变来确定设备是否是移动的（在桌面设备上不会发生）。

这对我来说更可取，因为这意味着我不必担心用户代理值在某些设备上被更改，并且我不必在新浏览器出现时返回并添加它们。

此外，现在许多手持设备的屏幕分辨率都非常高，因此您也不能依赖屏幕尺寸。

于 2013-02-11T14:47:32.787 回答
2

您可以使用 JavaScript 将访问者引至另一个 URL。

    <script type="text/javascript">

            if( navigator.userAgent.match(/(android|blackberry|ipad|iphone|ipod|iemobile|opera mobile|palmos|webos|googlebot-mobile)/i) )
            {
            document.location.replace("/mobile/");
            }

    </script>

您还可以进行响应式网页设计

这将是您的用户和 SEO 的最佳解决方案。

于 2013-02-11T14:45:11.050 回答
0 
mobileDeviceCheck: function(system) {
    if(system) {
        if(navigator.userAgent.match(system)) {
            return true;
        } else {
            return false;
        };
    } else {
        if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || (navigator.userAgent.match(/iPad/i)) || (navigator.userAgent.match(/Android/i))) {
            return true;
        } else {
            return false;
        };
    };
}

通用功能

于 2013-02-11T14:56:38.280 回答