移動/桌面的不同菜單

Question

所以我使用Bootstrap並在桌面/平板電腦和移動設備上使用不同的菜單。我有一個固定的頂部固定的桌面/平板電腦導航欄和一些標籤是多列下拉菜單使它不適合用於移動設備，所以我正在做一個幻燈片推送菜單。任何人都可以向我指出如何有效地實現這一目標的大方向？我知道如何自己實現這些菜單，它只是簡化了它們各自的設備。我需要使用媒體查詢和display：none for each menus，or may be a JS if if statement？後者是否會導致移動版本將站點加載速度減慢到不可行的程度，因爲其他菜單很廣泛？

我已經搜索了SE，並找到了答案，但它僅適用於WP，所以並沒有真正的幫助，但它使用了一個if語句。謝謝你的幫助！

Answer 1

如果您正在使用Bootstrap，那麼您可以使用類來告訴部件是否隱藏，具體取決於屏幕的寬度。

這些類別是hidden-xs,hidden-sm等等。

見到這對引導文件： http://getbootstrap.com/css/#responsive-utilities

Answer 2

使用display : none與媒體查詢會做的工作，並不會在移動版引起任何問題。