javascript - 不同的行为取决于手机

Question

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

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

有小费吗？

score 0 · Accepted Answer

我最近使用全局 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)" />

1 回答 1