jquery移動網格視圖和列表視圖在同一頁

Question

新的jQuery Mobile。我有一份股票名單，我希望能夠在同一頁面上更改視圖。所以，我有我的名單，那麼我希望能有兩個按鈕在頁面的頂部：

• 列表視圖（默認）
• 網格視圖

然後我可以改變股票的視圖取決於我點擊哪個按鈕。我有一個工作示例：

這裏的an example URL圖預覽，點擊「投資組合」

怎麼能這樣做？

Answer 1

我認爲你可以通過最簡單的方式做到這一點。只需在您的網站添加列表視圖和網格視圖，然後在它們中添加網格視圖和toggle。

Answer 2

試試這個：

CSS

#Container ul { list-style: none; alignment-adjust:central; } 
#Container .list li { //your list specs } 
#Container .grid li { //your grid specs }​ 

HTML

<div data-role="content" id="Container"> 
    <ul data-role="listview" class="list"> 
     <li>list1</li> 
     <li>list2</li> 
     <li>list3</li> 
    </ul> 
    <ul data-role="listview" class="grid"> 
     <li>grid1</li> 
     <li>grid2</li> 
     <li>grid3</li> 
     <li>grid4</li> 
    </ul> 
</div>