在移動設備上顯示引導程序模式

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