在移動視圖（wordpress）中更改列順序。有可能的？

Question

我在這裏有一個問題。我想在MOBILE上更改網站欄目順序。我嘗試使用JavaScript，但似乎不工作是我的代碼錯了嗎？使用Wordpress

這裏Im爲當前的桌面視圖：[A] [B] [C]

當前的移動的觀點是這樣的。

並[a]

並[b]

並[c]

我想我的列出現這樣

並[b]

並[a]

[c]

這裏是我的代碼

<script> 
    var $iW = $(window).innerWidth(); 
    if ($iW < 480){ 
    $('.b').insertBefore('.a'); 
    }else{ 
    $('.b').insertAfter('.a'); 
    } 
</script> 

Answer 1

可以使用2只HTML列有div容器像

<div class="for_desktop"> 
[a] 
[b] 
[c] 
</div> 

<div class="for_mobile"> 
[b] 
[a] 
[c] 
</div> 

寫的CSS一樣：

@media only screen and (max-width: 500px) { 
    .for_desktop{ display:none;} 
} 

@media only screen and (min-width: 500px) { 
    .for_mobile{ display:none;} 
} 

注：寬度將改變（你設置如你所需）。