使用jQuery調整窗口大小的響應表

我有一個兩列表，我試圖在特定的屏幕大小上轉置，以便它們變成彼此重疊的行。左欄顯示時間，右欄顯示內容。使用jQuery調整窗口大小的響應表

<table> 
<tr> 
    <td>08.30</td> 
    <td>Content</td> 
</tr> 
<tr> 
    <td>09.30</td> 
    <td>Content</td> 
</tr> 
<tr> 
    <td>10.00</td> 
    <td>Content</td> 
</tr>

我一直在努力，實現這個technique在$ window.resize功能，但表保持開關爲我調整窗口的大小。我對jQuery不太熱，所以任何幫助都會很感激。這是我的example。

許多

來源

2015-11-04 ChopChopOnionHead

http://jsfiddle.net/brettdewoody/xnJ9Q/ heres它的一個例子 – Derple

最容易完成浮動DIV和媒體查詢。 http://www.w3schools.com/css/css_rwd_mediaqueries.asp –

Div與flex可能？ –

這是你在找什麼：https://jsfiddle.net/JTBennett/veLkf11f/3/？

檢查下，看看它是如何工作的：

/* GO FULL WIDTH BELOW 480 PIXELS */ 
@media only screen and (max-width: 480px) { 
    .col { margin: 1% 0 1% 0%; } 
    .span_3_of_3, .span_2_of_3, .span_1_of_3 { width: 100%; } 
    .span_2_of_2, .span_1_of_2 { width: 100%; } 
    .content {text-align:center;} 
    .time {text-align:center;} 
}

使用此工具，如果你想使自己的可摺疊列設計的竅門：http://www.responsivegridsystem.com/calculator/

希望幫助！ -Joel

來源

2015-11-04 02:20:58 Joel

使用jQuery調整窗口大小的響應表

回答

相關問題