在移动设备上显示引导程序模式

Question

我已经创建了一种模式，以警告移动用户在继续通过我的数据密集型站点之前打开其WIFI。我想在移动（xs，s）设备上打开此模式。我使用的引导4.

我试图利用引导responsive utilities在我的模板，尤其是类.hidden-md-up，但无论在哪里使用这个类，也结束了一些剩余的覆盖，禁用某些网站的功能。这是因为我仍然打开模式，然后隐藏它：不是一个优雅的解决方案。

我正在寻找任何方式来利用bootstrap来感应小屏幕/移动设备。我正在使用角2，因此我正在避免jQuery。我还没有在我的项目中使用jQuery。这将是很好，以避免加载库只是这个奖金的功能

Answer 1

你可以如下使用matchmedia，但是它依赖于硬编码，在

if (window.matchMedia('(max-width: 767px)').matches) { 
    //load your modal here 
} else { 
    //... 
} 

引导更改如果你不希望宽度以硬编码的宽度，看看这个帖子的方式来确定引导程序的大小中断：https://stackoverflow.com/a/28373319/4553162