不同的行为取决于移动[关闭]答案

【问题标题】：Different behavior depending on mobile [closed]不同的行为取决于移动[关闭]
【发布时间】：2013-10-05 15:32:26
【问题描述】：

我正在制作一个有角度的客户/订单管理应用程序，如果它是一个大屏幕/桌面，我希望有来自 angularstrap 的弹出框和模式，如果它是一个小屏幕/移动设备，我希望有路由。

我想我需要一个自定义指令，但我不知道怎么做。

有什么建议吗？

【问题讨论】：

【解决方案1】：

我最近使用全局 JS 函数取得了成功：

window.myapp = window.myapp || {};

window.myapp.isMobile = function() {
    return ($(window).width() <= 600);
};

然后，在您的控制器中，只要您需要根据显示尺寸应用一些不同的行为，您就可以简单地调用此函数：

if (myapp.isMobile()){
    //do mobile stuff        
}
else{
    //do desktop stuff
}

我发现这是一种实用且坚如磐石的方法，可用于现代移动设备，以及 firefox、chrome、IE8+ 和 safari。

您可以更进一步，还可以利用响应式设计并使用媒体查询加载自定义的仅限移动设备的样式表：

<link href="<your path here>/mobile.css" rel="stylesheet" media="screen and (max-width: 600px)" />

【讨论】：