隱藏Derek Eder的融合表模板的左側邊欄

Question

如何隱藏Fusion table template的左側邊欄？ 在手機的寬度上，左側邊欄將顯示在地圖的頂部。 如何將其隱藏在可摺疊的導航欄？ 我有幾個自定義過濾器。能夠在移動設備上隱藏它們會很好。否則，您需要向下滾動以查看地圖，該地圖不方便用戶使用。謝謝！

---

好吧，但那隻能解決部分問題。左側邊欄將顯示在內部 *div class="collapse navbar-collapse"* 因此，當用戶點擊導航欄時，它會彈出。像this

---

我剛剛發現this website具有相同的功能，也就是顯示左側欄上，一方面桌面版本，和塌陷側邊欄在另一方面移動版本。 和the related stackoverflow question。

但是the accepted render view只摺疊側邊欄而沒有將其置於移動版本的頂部;相反，它把它放在左邊。

我不確定將左邊欄摺疊並在移動版本頂部顯示它是微不足道的？

Answer 1

你可以做這樣的事情：

@media(max-width:760px) 
{ 
    #yourelement{ 
    display:none; 
    } 
} 

它說的，當你的窗口下760px寬，你讓元素目標由ID =「yourelement」要隱藏。

Answer 2

您也可以使用不同的模板，用於較窄的屏幕：https://github.com/derekeder/FusionTable-Map-Template#iframe-template